先说 cli 2.0 的：
下载 compression\-webpack\-plugin 这个 plugin
在你的 webpack.prod.conf.js 文件里添加以下代码：
（与 webpackConfig 平级）
// 开启 gzip 压缩
if (config.build.productionGzip) {const CompressionWebpackPlugin = require('compression-webpack-plugin')
webpackConfig.plugins.push(
new CompressionWebpackPlugin({filename: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp(
'\\.(' +
config.build.productionGzipExtensions.join('|') +
')$'
),
threshold: 10240,
minRatio: 0.8
})
)
}
再将 config 文件夹下的 index.js 中的 productionGzip 改为 true 即可，如果报错
说明你的 plugin 版本太高了，降低版本即可 npm install --save-dev compression-webpack-plugin@1.1.12
**
在推荐一个优化，在 webpack.prod.conf.js 的UglifyJsPlugin中添加一下一句话`
compress: {
warnings: false,
// ===== 以下是新增的 =====
drop_console: true, // 删除页面中的 console.log
pure_funcs: ['console.log']
// ===== 以上是新增的 =====
},可以去除掉所有的 console
接下来说 3.0 的（偷我们老大的文章）
下载
npm i \-D compression\-webpack\-plugin我们老大只是修改了 vue.config.js
const CompressionPlugin \= require("compression-webpack-plugin")
module.exports \= {
assetsDir: 'public',
runtimeCompiler: true,
publicPath: '',
configureWebpack: config \=> {if (process.env.NODE\_ENV \=== "production") {
return {
plugins: \[new CompressionPlugin({
test: /\\.js$|\\.html$|\\.css/,
threshold:10240,
deleteOriginalAssets:false
})\]
}
}
}
}即可