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

相关推荐
2601_94919426几秒前
TypeScript 与后端开发Node.js
javascript·typescript·node.js
pancakenut12 分钟前
自定义属性:从html到react
前端
hmh1234512 分钟前
录音与音频可视化
前端·javascript
ZC跨境爬虫29 分钟前
3D 地球卫星轨道可视化平台开发 Day13(卫星可视化交互优化+丝滑悬停聚焦)
前端·算法·3d·json·交互
qq_4198540536 分钟前
animation 和 transition
前端
weixin1997010801636 分钟前
《孔夫子旧书网商品详情页前端性能优化实战》
前端·性能优化
spring2997921 小时前
SpringBoot返回文件让前端下载的几种方式
前端·spring boot·后端
木斯佳1 小时前
前端八股文面经大全:正泰电气前端实习一面(2026-04-19)·面经深度解析
前端·面试·笔试·校招·面经
江-月*夜1 小时前
vue3 wordcloud2.js词云使用
开发语言·javascript·vue.js
用户69371750013841 小时前
你每天用的 AI,可能真的被“投毒”了
前端·后端·ai编程