create-react-app集成webpack-bundle-analyzer

675 阅读1分钟

背景

create-react-app 搭建项目,引入 webpack-bundle-analyzer 打包分析工具,分析文件大小。

步骤

1.先运行npm run eject,将配置文件放在本地。

2.安装npm install webpack-bundle-analyzer --save-dev

3.在 config/webpack.config.js 文件中,

添加

const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

new webpack.IgnorePlugin下方加 new BundleAnalyzerPlugin()

 new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
 new BundleAnalyzerPlugin(),

4、运行npm run build,即可查看js文件大小

tips:

正式代码慎用npm run eject