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

相关推荐
WebRuntime35 分钟前
问世间,exe是何物?直教AI沉默、Web寡言(4)
javascript·c#·.net·web
全栈技术负责人40 分钟前
Ling框架:针对AIGC工作流中JSON数据流式处理的解决方案
前端·ai
自由与自然44 分钟前
实现类似van-dialog自定义弹框
前端·javascript·html
KLW751 小时前
vue3中操作样式的变化
前端·javascript·vue.js
天天讯通1 小时前
BI 报表:呼叫中心的伪刚需
大数据·前端·数据库
WebInfra1 小时前
Midscene v1.0 发布 - 视觉驱动,UI 自动化体验跃迁
javascript·人工智能·测试
自由与自然1 小时前
栅格布局常用用法
开发语言·前端·javascript
Violet_YSWY1 小时前
讲一下ruoyi-vue3的前端项目目录结构
前端·javascript·vue.js
这是你的玩具车吗1 小时前
转型成为AI研发工程师之路
前端·ai编程
Drift_Dream1 小时前
在Vue样式中使用JavaScript 变量(CSS 变量注入)
前端