vue頁面加載慢,chunk-vendors.js文件太大


今天拉取合並了同事的代碼后頁面加載速度變得非常慢,經過排查發現是因為加載的chunk-vendors.js太大

58m 28s就很離譜

經過同事指導加上百度終於找到解決辦法,配置compression-webpack-plugin實現Gzip壓縮
安裝compression-webpack-plugin: yarn add compression-webpack-plugin@5.0.1
這個要指定版本,不然會有其它問題

在vue.config.js中添加配置
const CompressionWebpackPlugin = require('compression-webpack-plugin');
const productionGzipExtensions = ['js', 'css'];

module.exports = {
configureWebpack: config => {
config.plugins.push(new CompressionWebpackPlugin({
algorithm: 'gzip',
test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
threshold: 10240,
minRatio: 0.8
}));
config.devtool = false;
},
chainWebpack: config => {
config.plugins.delete("prefetch");
// 移除 preload 插件
config.plugins.delete('preload');
// 壓縮代碼
config.optimization.minimize(true)
},
}
配置完成后重啟項目,刷新瀏覽器就可以了


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM