Vue cli项目开启Gzip
2024-08-30 03:33:50
安装 compression-webpack-plugin
建议安装v1.1.11版本，最新版本可能会报错
cnpm i compression-webpack-plugin@1.1.11 -D
更改配置文件
开启生产环境gzip功能。
/config/index.js：
productionGzip: true,
/build/webpack.prod.config.js：
webpackConfig.plugins.push(
new CompressionWebpackPlugin({
filename: '[path].gz[query]', // asset 改为 filename
algorithm: 'gzip',
test: new RegExp(
'\\.(' +
config.build.productionGzipExtensions.join('|') +
')$'
),
threshold: 10240,
minRatio: 0.8
})
)
最后重新构建项目
npm run build
可以看到构建后的项目 /static中的静态资源目录中多了后缀 .gz的压缩文件。
服务器开启gzip功能
我们服务器使用Express，安装插件 compression
cnpm i compression -S
添加中间件
app.js：
const compression = require('compression');
app.use(compression())
最后重启服务器，浏览页面可以看到加载的资源文件大小比之前明显减小了。
最新文章
- JavaScript变量和作用域
- hello Cookie
- oracle学习笔记（一）配置监听
- ABAP后台JOB数量控制
- 利用c++操作XML，主要是内部循环方法的使用
- webservice使用基本技巧
- postgreSQL-如何查数据库表、字段以及字段类型、注释等信息？
- RLE行程长度编码压缩算法
- Java之戳中痛点 - （7）善用Java整型缓存池
- 海量服务实践──手 Q 游戏春节红包项目设计与总结（上篇）
- PAT1001 A+B Format
- 输入法searchLookUpEditd的使用
- MySQL中kill掉所有表的进程
- NFC读写电子便签总结
- Android Java语法学习
- JS发送短信验证码
- MySQL：常用的数据模型
- java注解的自定义和使用
- hiveserver2连接报错： User: root is not allowed to impersonate anonymous (state=08S01,code=0)
- python isinstance用法