通过 webpack-bundle-analyzer

vue-cli2.x 的点这个

安装

• npm i webpack-bundle-analyzer -D

  配置

  module.exports = {
  chainWebpack: config => {
    config
      .plugin('webpack-bundle-analyzer')
      .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
  }
  }

  查看

• npm run serve 或 npm run build 后会自动在浏览器打开分析界面

  通过 —report

  package.json 文件里，在打包命令后面加上 —report
  运行打包命令后会在打包输出目录生成一个 report.html 文件，用浏览器打开即可查看打包分析界面

  {
    "scripts": {
    "build": "vue-cli-service build --report"
  }
  }