1,安装npm i -D vite-plugin-compression 2,配置vite.config.ts文件 importviteCompressionfrom'vite-plugin-compression'plugins:[// ...,viteCompression({threshold:50000//对于大于50KB的文件压缩})], 3,配置说明 filter:过滤器,对哪些类型的文件进行压缩,默认为 ‘/.(js|mjs|json|css|html)$/i’ verbose...
npm install -D vite-plugin-compression 2. 在vite.config.ts中添加插件。 exportdefault defineConfig({plugins:[viteCompression({filter: /\.(js|css|json|txt|ico|svg)(\?.*)?$/i, // 需要压缩的文件 threshold: 1024, // 文件容量大于这个值进行压缩 algorithm:'gzip', // 压缩方式 ext:'gz', ...
import compressPlugin from "vite-plugin-compression"; export default defineConfig({ // (常用) plugins: [ compressPlugin({ filter:/xxx/g, // 不打包文件 threshold:1025, // 超过 1025b打包 ext:'.gz' // 以gz的后缀 }) ] }) 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12....
#压缩时删除原始文件的配置:gzip-clear、brotli-clear、both-clear(同时开启 gzip 与 brotli 压缩)、none(不开启压缩,默认) VITE_COMPRESSION="none" #base api VITE_APP_BASE_API='/api' Expand Down 67 changes: 67 additions & 0 deletions67build/compress.ts ...
vite-plugin-compression是一个基于Vite的插件,用于gzip或Brotli压缩你的资源,从而减少页面的加载时间和网络带宽,提高用户访问速度和体验。 前端: yarnaddvite-plugin-compression-D image.png import{defineConfig}from'vite'importreactfrom'@vitejs/plugin-react'importviteCompressionfrom"vite-plugin-compression";// ...
assetsInclude 配置需要包含的静态资源。server 配置开发服务器的选项，包括端口号、跨域、热更新、代理等。优化插件：vite-plugin-compression：此插件可以对构建出来的文件进行压缩，从而减小文件大小，提高页面加载速度。vite-plugin-style-import：此插件可以让你在项目中使用 CSS 类库，比如 Ant Design 或者 Element ...
import viteCompression from 'vite-plugin-compression' // 开启压缩export function configViteCompression() {// 开启压缩 [文档](https://github.com/anncwb/vite-plugin-compression/blob/main/README.zh_CN.md)return viteCompression({verbose: true,disable: false,// filter:()=>{}, // 那些资源不压缩...
首先安装了rollup-plugin-visualizer插件。可以使用npm或者yarn进行安装: yarn add rollup-plugin-visualizer -D npm i rollup-plugin-visualizer -D 1. 2. 在vite.config.js中引入rollup-plugin-visualizer插件,并将其添加到插件列表中。 import { visualizer } from 'rollup-plugin-visualizer'; ...
legacyPlugin({ targets: ["chrome 52"] // 需要兼容的目标列表,可以设置多个 }), viteCompression({ filter: /.(js|mjs|json|css|html)$/i, //过滤器,对哪些类型的文件进行压缩,默认为/.(js|mjs|json|css|html)$/i verbose: true, //是否在控制台输出压缩结果,默认为 true ...
1、Nginx服务器只需要配置: 2、nodejs启用gzip以express框架为例: npm install compression npm install @types/compression--save-dev importcompressionfrom'compression'; ...constapp =express(); app.use(compression()); ... compression-webpack-plugin ...