nwb
nwb copied to clipboard
Support use of Webpack Bundle Analyzer
Add an --analyze
/--analyse
flag which enables use of BundleAnalyzerPlugin
to make it easy to inspect the contents of bundles.
I added it to my project. I believe the only changes I made were:
package.json scripts (my script should probably run build first):
"stats:analyzer": "webpack-bundle-analyzer dist/stats.json dist",
package.json devDependencies:
"stats-webpack-plugin": "^0.4.3",
"webpack-bundle-analyzer": "^2.2.3",
nwb.config.js webpack plugins:
plugins.push(new StatsPlugin('stats.json', {chunkModules: true}))
and how do you generate stats.json
!!
@grahamlyus I have this, but npm run build
does not generate stats.json
plugins: [
new StatsPlugin('stats.json', {chunkModules: true}),
new BundleAnalyzerPlugin({generateStatsFile: true, analyzerMode: 'disabled'})
]
@broncha Perhaps BundleAnalyzerPlugin
conflicts with StatsPlugin
? Personally I prefer to run the stats analysis on an on-demand basis, as my build is already quite long.
StatsPlugin should output stats.json
in the dist
folder, unless you have changed it.
Perhaps you can paste you entire package.json
and nwb.config.js
if it's still not working
Late to the party here, but just in case anyone else stumbles on this issue...I was able to get stats.json
created during npm run build
with the following nwb.config.js
file.
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
module.exports = {
type: 'react-component',
npm: {
esModules: true,
},
webpack: {
extra: {
plugins: [new BundleAnalyzerPlugin({ generateStatsFile: true, analyzerMode: 'disabled' })],
},
},
};
and then add webpack-bundle-analyzer
as a dev dependency and the same script mentioned above, "stats:analyzer": "nprm run build && webpack-bundle-analyzer dist/stats.json dist"
, replacing the stats.json
file to wherever yours ends up being generated.
And this works with "nwb": "0.24.x", "webpack-bundle-analyzer": "^3.7.0"
at the moment .