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

相关推荐
future141210 分钟前
项目开发日记
前端·学习·c#·游戏开发
汪子熙19 分钟前
CSS 中 td:last-child a 选择器详解
前端·javascript
q5673152326 分钟前
Koa+Puppeteer爬虫教程页面设计
javascript·css·爬虫
北北~Simple33 分钟前
第一次搭建数据库
服务器·前端·javascript·数据库
梁辰兴33 分钟前
企业培训笔记:Vue3前端框架配置
笔记·前端框架·npm·vue·vue3·node
GanGuaGua40 分钟前
Vue3常用指令
前端·javascript·vue.js
欧阳天风40 分钟前
录音实时上传
前端·javascript
江号软件分享44 分钟前
从DNS到防火墙:NetDisabler多策略断网方法详解
前端
灵犀学长1 小时前
解锁HTML5页面生命周期API:前端开发的新视角
前端·html·html5
江号软件分享1 小时前
轻松解决Office版本冲突问题:卸载是关键
前端