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

相关推荐
沐土Arvin6 小时前
港澳台行政区域json
前端
程序员鱼皮6 小时前
我花 300 块,让 Claude Fable 5 开发桌面 APP,值么?
前端
William_Xu6 小时前
JavaScript 并发控制
前端
拾年2756 小时前
从零手写 Ajax:用原生 XHR 搭建前后端交互全流程
前端·javascript·ajax
光影少年6 小时前
懒加载与分包:React.lazy + Suspense
前端·react.js·掘金·金石计划
拉勾科研工作室7 小时前
区块链工程毕业论文题目【249个】
开发语言·javascript
小林ixn7 小时前
你以为你懂 + 号?看完这篇 Bun + TS 实战,才发现以前全写错了
前端·javascript·typescript
namexingyun7 小时前
开源前端生态如何成为 AI UI 生成的“燃料“:shadcn/ui、Tailwind CSS、Storybook 技术价值全解剖
java·前端·人工智能·python·ui·开源·ai编程
Zyed7 小时前
[STM32]Day15读写FLASH+读取ID
前端·stm32·性能优化
jvxiao8 小时前
你真的懂作用域吗?从编译原理角度深度 JS 的作用域
前端·javascript