webpack-bundle-analyzer - 分析工具

1. 介绍

可视化显示 bundle 里包含哪些包及其体积

2. 使用

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

/*
  "analyze:prod": "cross-env NODE_ENV=production ANALYZE=YES vue-cli-service build --mode prod",
*/
const IS_ANALYZE = process.env.ANALYZE === 'YES';

module.exports = {
  plugins: [
    IS_ANALYZE ? new BundleAnalyzerPlugin() : null,
  ].filter(Boolean)
}

3. 参考

• webpack-bundle-analyzer —— NPM (opens new window)