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

相关推荐
Bruce_Liuxiaowei6 小时前
前端校验登录态,等于没校验——一次应急广播终端高危漏洞的发现与报送
运维·前端·安全
Meta Luo6 小时前
AI 时代,Web 自动化测试该怎么做?
前端·人工智能·playwright 替代工具·无代码自动化测试工具·低代码 ui 自动化测试·web 回归测试工具
去伪存真6 小时前
AI Agent 性能评估指标与自动化测试落地方案
前端·agent
MaAidan7 小时前
用 Agent 排查线上问题:SLS 日志分析 + DB/Redis 数据验证,一条链路搞清楚
前端·bootstrap·html
墨林陌7 小时前
AI 热点日报(2026-11-03):美团发布 1.6 万亿参数国产大模型,四大厂商共推 AI 训练退出标准
前端
Moment7 小时前
DeepSeek 发布新模型,直接把 Agent 联网搜索的门槛打下来了!
前端·后端
AI宇宙狂想家7 小时前
开源 AI 视频工具进化史:从难用到好用,OpenMontage 改了什么
开发语言·前端·人工智能·开源·ai创业·openmontage
Sailing8 小时前
🚀🚀【封闭结束7】Agent 为什么总是“失忆”?从长期记忆到上下文工程的生产实践
前端·人工智能·agent
OpenTiny社区8 小时前
AI 生成的 Vue 代码,终于能直接用了!
前端·vue.js·github
程序员大阳8 小时前
副队长JavaScript教程(67)-Ajax初识:背景、历史与核心概念
javascript·ajax·同步·异步·概念·背景·来是