vue(typescript) 使用webpack-bundle-analyzer

时间:2022-07-24
本文章向大家介绍vue(typescript) 使用webpack-bundle-analyzer，主要内容包括其使用实例、应用技巧、基本知识点总结和需要注意事项，具有一定的参考价值，需要的朋友可以参考一下。

1.安装

npm intall webpack-bundle-analyzer

2.vue.config.js中配置

 chainWebpack: config => {
        if(process.env.NODE_ENV === 'production'){
               if(process.env.npm_config_report){
                      config.plugin('webpack-bundle-analyzer')
                      .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin)
                      .end();
                      config.plugins.delete('prefetch');
                }
         }
 }

3.package.json scripts中添加

 "analyze":"cross-env NODE_ENV=production npm_config_report=true npm run build"
 或者
 "analyze": "npm_config_report=true npm run build"

4.运行

npm run analyze

随机文章
Javascript知识点必读
最近更新