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

相关推荐
王林不想说话3 分钟前
ES6 到 ES2026 全面进阶指南:新特性、原理、示例与工程落地
前端·javascript·面试
用户43523713814935 分钟前
🚀 Vue3 + TypeScript 学习笔记:从泛型 T 到 Promise<T>,终于搞懂了 keyof 和 typeof
前端
跟着群主去吃肉6 分钟前
Cinemachine的应用-第三人称视角
前端·unity3d·游戏开发
东方小月7 分钟前
从零开发一个 Coding Agent(十):实现 CLI 参数解析与静态命令
前端·人工智能·开源
阿黎梨梨8 分钟前
Next.js 全栈开发:从 SPA 的痛点到 SSR 的破局之道
前端·后端
沐道PHP8 分钟前
CRMEB多店版diy装修位置偏移修复
前端
WZzz9 分钟前
JavaScript 中 this 的「指向」完整教程
javascript
犀利的毛豆豆16 分钟前
useCallback
前端
犀利的毛豆豆17 分钟前
React.memo和useCallback组合使用
前端
mONESY20 分钟前
浏览器里跑 DeepSeek-R1,这份 worker.js 到底写了什么
javascript