webpack打包分析学习笔记

方式一：

用如下命令生成一个打包描述文件stats.json

webpack --profile --json > stats.json

然后将输出的json文件上传到如下2个网站进行分析
http://alexkuz.github.io/webpack-chart/

https://github.com/webpack/analyse

方式二

用插件：webpack-bundle-analyzer
安装

npm install --save-dev webpack-bundle-analyzer

配置

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

module.exports = {
  plugins: [
    new BundleAnalyzerPlugin()
  ]
}

重新打包后会自动打开浏览器，如下图所示：