webpack-bundle-analyzer 是一个打包文件分析工具，主要作用是可以直观分析打包出的文件包含哪些，大小占比如何，压缩后的大小等等。
一、安装插件
npm install webpack-bundle-analyzer --D
二、配置 vue.config.js 文件
const { resolve } = require('path');
module.exports = {
....其它的配置
chainWebpack: (config) => {
if (process.env.NODE_ENV === 'production') {
config
.plugin('webpack-bundle-analyzer')
.use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin);
}
},
}
- 如果想在运行项目时就出现，则可以把 环境变量 的判断注释掉
- 打开的默认端口号是：
8888
效果
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。
