使用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,可以识别这类文件。

相关推荐
来恩10031 分钟前
EL表达式应用
前端·javascript·vue.js
希冀1232 分钟前
【CSS学习第十篇】
前端·css
小飞侠是个胖子10 分钟前
在 WebGL 中构建高性能 3D 沉浸式系统的三套高阶方案
前端·3d
wh_xia_jun12 分钟前
Vue3 + Vitest 浏览器测试 从零开发指南
前端·javascript·vue.js
FlyWIHTSKY14 分钟前
区块链前端技术栈介绍
前端·区块链
唐青枫15 分钟前
别再让 key 写成字符串:TypeScript keyof 从入门到实战
前端·javascript·typescript
一点一木8 小时前
深度体验TRAE SOLO移动端7天:作为独立开发者,我把工作流揣进了兜里
前端·人工智能·trae
天外飞雨道沧桑8 小时前
TypeScript 中 omit 和 record 用法
前端·javascript·typescript
Lee川9 小时前
mini-cursor 揭秘:从 Tool 定义到 Agent 循环的完整实现
前端·人工智能·后端
canonical_entropy9 小时前
从 Spec-Driven Development 到 Attractor-Guided Engineering
前端·aigc·ai编程