next-compose-plugins
next-compose-plugins copied to clipboard
My config is not working
Is something wrong with my config? None of the plugins are working.
const path = require('path');
const webpack = require('webpack');
const withPlugins = require('next-compose-plugins');
const withCSS = require('@zeit/next-css');
const withSass = require('@zeit/next-sass');
const withImages = require('next-images');
const withBundleAnalyzer = require('@zeit/next-bundle-analyzer');
const nextRuntimeDotenv = require('next-runtime-dotenv');
const nextBuildId = require('next-build-id')
const withConfig = nextRuntimeDotenv({
public: ['API_URL'],
});
const prod = process.env.NODE_ENV === 'production';
const sassConfig = {
cssModules: true,
cssLoaderOptions: {
importLoaders: 1,
ignoreOrder: true,
localIdentName: prod ? '[hash:base64:8]' : '[local]___[hash:base64:5]'
}
};
const bundleAnalyzerConfig = {
analyzeServer: ['server', 'both'].includes(process.env.BUNDLE_ANALYZE),
analyzeBrowser: ['browser', 'both'].includes(process.env.BUNDLE_ANALYZE),
bundleAnalyzerConfig: {
server: {
analyzerMode: 'static',
reportFilename: '../bundles/server.html',
},
browser: {
analyzerMode: 'static',
reportFilename: '../bundles/client.html',
},
},
};
const nextConfiguration = {
generateBuildId: () => nextBuildId({ dir: __dirname }),
webpack: (config, { dev }) => {
// some config
return config;
},
};
module.exports = withPlugins([
[withConfig],
[withImages],
[withBundleAnalyzer, bundleAnalyzerConfig],
[withCSS(withSass), sassConfig],
], nextConfiguration);
I wonder if this (simplified) example, where the webpack config isn't getting seen (for example, error messages from the console indicate the raw-loader and @svgr/webpack parts aren't getting through) is similar to what @sks-2410 is experiencing:
const withPlugins = require('next-compose-plugins')
const withImages = require('next-images')
const optimizedImages = require('next-optimized-images')
const webpackConfig = {
target: 'serverless',
webpack: function (config) {
config.module.rules.push(
{
test: /\.md$/,
use: 'raw-loader',
},
{
test: /\.svg$/,
use: ['@svgr/webpack'],
}
)
return config
},
}
module.exports = withPlugins([
[withImages, {}],
[optimizedImages, {}],
], webpackConfig)
Corrections/comments appreciated.
Any thoughts on what I mentioned above? Still not clear on this.