安裝compression-webpack-plugin
npm compression-webpack-plugin --save-dev
vue.config.js配置Gzip壓縮
// 導(dǎo)入compression-webpack-plugin
const CompressionWebpackPlugin = require('compression-webpack-plugin')
// 定義壓縮文件類型
const productionGzipExtensions = ['js', 'css']
module.exports = {
// 配置反向代理
devServer: {
proxy: {
'/api': {
target: 'http://172.31.120.61:8080/',
// target: 'http://172.31.120.158:8080/',
ws: true,
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
}
}
},
configureWebpack: {
plugins: [
new CompressionWebpackPlugin({
filename: '[path].gz[query]',
algorithm: 'gzip',
test: new RegExp('\\.(' + productionGzipExtensions.join('|') + ')$'),
threshold: 10240,
minRatio: 0.8
})
]
}
}
配置Nginx
gzip on; #開啟或關(guān)閉gzip on off
gzip_disable "msie6"; #不使用gzip IE6
gzip_min_length 100k; #gzip壓縮最小文件大小,超出進(jìn)行壓縮(自行調(diào)節(jié))
gzip_buffers 4 16k; #buffer 不用修改
gzip_comp_level 8; #壓縮級(jí)別:1-10股毫,數(shù)字越大壓縮的越好宴卖,時(shí)間也越長
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png; # 壓縮文件類型