项目拖了这么久终于差不多要上线了，记录一下Vue项目的一些优化。
1. 去掉打包后的.map文件
运行npm run build后在dist/js文件夹下面会生成.map的文件，打包后的代码都是经过压缩、混淆的，如果代码哪里出错了就很难定位到具体的源代码位置，那么.map文件可以简单理解为还原调试。
可以通过在vue.config.js配置打包时不生成.map文件。
image.png
productionSourceMap: process.env.NODE_ENV === "production" ? false : true,
打包前后对比
2.开启Gzip压缩
首先安装compression-webpack-plugin
npm install compression-webpack-plugin --save-dev
配置vue.config.js`文件
image.png
configureWebpack: () => {
if (process.env.NODE_ENV === "production") {
return {
plugins: [
new compression({
test: /\.js$|\.html$|\.css/, //匹配文件名
threshold: 10240, //超过10k的文件才进行压缩
deleteOriginalAssets: false //是否删除原文件
})
]
};
}
}
image.png
