本文主要介紹webpack 打包時：去除
console.log祥绞、注釋、并使用多進程并發(fā)運行以提高構(gòu)建速度鸭限。
圖1-1 未去除冗余代碼
圖1-2 去除冗余代碼
由上圖可知蜕径，去除冗余代碼（圖1-2）打包后的體積明顯比 未去除冗余代碼（圖1-1）打包后的體積小。
vue.config.js配置
const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
configureWebpack: {
optimization: {
// production環(huán)境生效 - 官方文檔https://webpack.docschina.org/plugins/terser-webpack-plugin/
minimizer: [
new TerserPlugin({
// 使用多進程并發(fā)運行以提高構(gòu)建速度（webpack是單線程败京，開啟多線程壓縮速度更快）
parallel: 4,
// 是否將注釋剝離到單獨的文件中（默認為true）: 去除js打包后的LICENSE.txt文件(里面是注釋)
extractComments: false,
terserOptions: {
// 去除打包的console.log
compress: {
warnings: false,
drop_console: true,
drop_debugger: true,
pure_funcs: ['console.log']
},
// 去除注釋
output: {
comments: false
}
}
})
]
}
}
}
相關(guān)文章
一兜喻、webpack優(yōu)化之Gzip（vue）
三、webpack優(yōu)化之第三方庫使用 CDN 加載(vue)
