webpack 打包性能分析工具

1. webpack-bundle-analyzer，推荐使用

   新版 vue-cli (旧版按照新版的进行配置即可)已经集成该插件，在项目的 package.json 文件中注入如下命令，然后运行(npm run analyze)，默认会打开 http://127.0.0.1:8888 作为展示。

“analyze”: “NODE_ENV=production npm_config_report=true npm run build”

2. webpack-chart 以及 webpack-analyse

   这两个站点也是以可视方式呈现构造的组件，可以让你清楚的看到模块的组成部分；不过你需要运行以下命令，生成工具分析所需要的 json 文件：

webpack --profile --json > stats.json
// 如果运行指定的 webpack 文件，可用此命令
webpack --config build/webpack.prod.conf.js  --profile --json > stats.json