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

相关推荐
律宏阔2 小时前
阿里云 ESA + Pages 域名部分电脑无法访问
前端
Lank_M2 小时前
canvas 第一次画字没用上字体,字体却是它要来的
前端
古夕3 小时前
iframe 授权失败时露出 60000 JSON 的复盘
前端·javascript
古夕3 小时前
地址变了,页面是空的:一次 Vue Router 菜单切换复盘
前端·vue.js
JavaGuide3 小时前
推荐一个好用 DeepSeek Harness 插件,直接把 Agent 上下文给可视化了!
前端·后端
数据掘金3 小时前
白屏故障定位:从资源请求到路由渲染的排查顺序
前端
程序员Sunday3 小时前
ES Module 和 CommonJS 有什么区别?循环依赖时会发生什么?
前端·javascript·面试
玲珑意3 小时前
Vue 3 + DAG拓扑排序 + SSE流式人机协同:现代AI工作流编排系统的工程化实践
前端
三十而立洋3 小时前
TypeScript 7.0 深度解析:新特性、Go 原生编译器及与 TypeScript 6.0 的区别
前端·typescript·前端工程化
编程之道3 小时前
从VUE2到VUE3学习过程遇到的一些困惑
前端