使用GZip对npm run build打包的vendor.js文件进行压缩

vue-cli项目

  1. 安装npm i compression-webpack-plugin -D

    npm i compression-webpack-plugin -D

  2. 使用:在vue.config.js文件中

    const CompressionPlugin = require('compression-webpack-plugin')
    module.exports = {
    configureWebpack: {
    plugins: [
    new CompressionPlugin({
    test: /.js|\.html|.css/,
    threshold: 10240 // 只处理比这个值大的资源。按字节计算 设置的是 10kb
    })
    ]
    }
    }

可以看到1.2M的vendors文件压缩到了295k,网页运行速度得到了提升,3

s内可以打开。

如果样式不识别,那么就不压缩css文件了。这个功能需要后端开启gzip,可以识别这类文件。

相关推荐
先吃饱再说7 小时前
JavaScript中`this` 的“千层套路”:从默认绑定到箭头函数的五种指向
javascript
玄星啊7 小时前
AI 编程的第 30 天,我怀念古法 Coding 了
前端·ai编程
Jolyne_7 小时前
Angular基础速通
前端·angular.js
foxire7 小时前
基于nodejs实现服务端内核引擎
javascript
锋行天下8 小时前
半秒开!还有谁!!!
前端·vue.js·架构
代码搬运媛9 小时前
git 下中文文件名乱码问题解决
前端
CaffeinePro9 小时前
告别知识点零散!React零基础通关,从环境搭建到Ant Design页面实战
前端·react.js
cidy_9810 小时前
水龙头领不到测试币?手把手用 Hardhat 本地环境零门槛学以太坊交易
前端
因_崔斯汀10 小时前
Three.js 3D 地图特效与材质实现指南
前端
angerdream10 小时前
手把手编写儿童手机远程监控App之vue3用 AI Agent生成菜单
前端