Vite 打包开启 gzip

安装插件

npm i vite-plugin-compression --save-dev

vite.config.js 配置

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
// gzip压缩
import viteCompression from "vite-plugin-compression";
const path = require("path");

// https://vitejs.dev/config/
export default defineConfig({
  base: './',
  plugins: [
    vue(),
    viteCompression(),
  ],
  resolve: {
    // 配置路径别名
    alias: {
      "@": path.resolve(__dirname, "./src"),
    },
  },
});

nginx 支持 gzip

开启模块之前可以查看是否有模块：--with-http_gunzip_module --with-http_gzip_static_module

nginx -V

如果没有需要安装，nginx官网
配置作用域 在 http, server, location 都可以

#开启gzip功能
gzip on; 
#开启gzip静态压缩功能
gzip_static on; 
#gzip缓存大小
gzip_buffers 4 16k;
#gzip http版本
gzip_http_version 1.1;
#gzip 压缩级别 1-10 
gzip_comp_level 5;
#gzip 压缩类型
gzip_types text/plain application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
# 是否在http header中添加Vary: Accept-Encoding，建议开启
gzip_vary on;