webpack打包gz文件,nginx开启gzip压缩

wepback配置

webpack4配合"compression-webpack-plugin": "^6.1.2"打包压缩gz

typescript 复制代码
chain.plugin("compression").use(
        new CompressionPlugin({
          test: /\.js$|\.html$|\.css$/,
          threshold: 10240, // 超过10KB的压缩
          deleteOriginalAssets: false,// 保留源文件
        })
      )

上传文件到服务器

nginx配置

typescript 复制代码
location /h5/ {
		gzip on;	// 动态压缩,如果没有gz文件再压缩
		gzip_static on;// 优先返回静态gz文件
		gzip_http_version 1.1;
		gzip_proxied expired no-cache no-store private auth;
		gzip_vary on;
		gzip_types text/plain application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
        add_header Cache-Control no-store;
        index  index.html;
        }
相关推荐
lichenyang4531 分钟前
ArkUI 票根卡片:PathShape 真挖洞,shadow 沿凹陷外发光
前端
Cache技术分享1 分钟前
432. Java 日期时间 API - 时间工具 TemporalQuery 详解
前端·后端
假如让我当三天老蒯8 分钟前
暂时性死区是否和闭包是相背的呢(自学用)
前端·javascript
渣波8 分钟前
前端开发主页面小技巧
前端·javascript
柯克七七10 分钟前
我用3个周末重构了公司的前端项目,老板没发现,但同事都来找我要代码了
前端
bonechips15 分钟前
JS:同步与异步,从单线程到 Promise 的编程之路
前端·javascript
如果超人不会飞15 分钟前
TinyVue Pager分页组件使用指南
前端·vue.js
看谷秀16 分钟前
Git笔记
前端
Aolith16 分钟前
从 Pinia 到 Zustand:我在 React 里复刻了一套用户状态管理
前端·react.js·typescript
先吃饱再说16 分钟前
为什么 `setTimeout` 会“插队”?JS 事件循环与 Promise 通关笔记
前端·javascript·promise