vue-cli 开启js代码压缩和代码分割
在vue.config.js中配置chainWebpack: config=>{config.optimization.minimize(true)// 开启压缩js代码(默认true)config.optimization.splitChunks({ // 开启代码分割chunks: 'all'}}启用gzip压缩(需要配置nginx,可以看出压缩后的文件大小明显变化)const Comp
·
在vue.config.js中配置
chainWebpack: config=>{
config.optimization.minimize(true)// 开启压缩js代码(默认true)
config.optimization.splitChunks({ // 开启代码分割
chunks: 'all'
}
}
启用gzip压缩(需要配置nginx,可以看出压缩后的文件大小明显变化)
const CompressionWebpackPlugin = require('compression-webpack-plugin')
chainWebpack(config) {
// 生产模式下启用gzip压缩 需要配置nginx支持gzip
if (process.env.NODE_ENV === 'production') {
config.plugin('CompressionWebpackPlugin').use(CompressionWebpackPlugin, [
{
filename: '[path][base].gz',
algorithm: 'gzip',
test: new RegExp('\\.(js|css)$'),
// 只处理大于xx字节 的文件,默认:0
threshold: 10240,
// 示例:一个1024b大小的文件,压缩后大小为768b,minRatio : 0.75
minRatio: 0.8, // 默认: 0.8
// 是否删除源文件,默认: false
deleteOriginalAssets: false
}
])
}
}
nginx 配置nginx参考文档
server {
listen 80;
server_name localhost;
gzip on;
gzip_static on;
gzip_types text/plain text/css application/json application/x-javascript text/xml application/xml application/xml+rss text/javascript;
gzip_proxied any;
gzip_vary on;
gzip_comp_level 6;
gzip_buffers 16 8k;
}
更多推荐
已为社区贡献2条内容
所有评论(0)