1.0.1 • Published 7 months ago
@klweb/vite-compression v1.0.1
@klweb/vite-compression
@klweb/vite-compression
是一款非常实用的 Vite
扩展插件,它可以帮助你在Vite进行项目打包时,开启静态资源压缩性能优化策略,自动压缩所有静态资源文件(如css、js、图片和音频等),很大程度减少静态资源的体积,以实现最佳的性能和用户体验。
@klweb/vite-compression
支持多种压缩算法,并且具有可配置选项,以便根据您的需求进行定制。默认开启gzip
压缩算法,在客户端请求时,服务器返回的gzip
类型资源时,会自动解压缩,从而还原原始的数据,这样,既能减少网络传输的带宽损耗,也能提高资源传输的效率。
安装插件
npm install @klweb/vite-compression -D
如何使用
在 vite.config.ts
文件中的 plugin[]
中使用插件:
import ViteCompress from '@klweb/vite-compression';
export default defineConfig({
plugins: [
ViteCompress({
limitFileSize: 10240, // 启用压缩的文件大小限制,单位是字节,默认为 10240(B)(即10KB以上文件进行压缩)
compressAlgorithm: 'gzip', // 压缩算法,默认 gzip
ext: '.gz' // 生成的压缩包后缀
})
]
})
配置参考
disableCompress
- 类型:boolean
- 默认:false
是否禁用压缩
fileExtFilter
- 类型:RegExp
- 默认:/.(js|mjs|cjs|json|css|html)\$/i
过滤器-对哪些类型的文件进行压缩
isDeleteOriginFile
- 类型:boolean
- 默认:false
压缩后是否删除源文件
isOutputLog
- 类型:boolean
- 默认:true
是否在控制台输出压缩结果信息
limitFileSize
- 类型:number
- 默认:10240
启用压缩的文件大小限制,单位是字节
compressAlgorithm
- 类型:'gzip' | 'brotliCompress' | 'deflate' | 'deflateRaw'
- 默认:gzip
压缩算法
ext
- 类型:'.gz' | '.br' | '.z' | '.z'
- 默认:.gz
生成的压缩包后缀
进阶
@klweb/vite-compression
支持 gzip
、brotliCompress
、deflate
和 deflateRaw
四种压缩算法,这些压缩算法都是无损压缩算法,可以将原本较大的文件或数据流压缩成较小的文件或数据流,从而减少网络传输的数据量,提高传输效率。
压缩算法说明:
gzip
:使用 gzip 压缩算法进行压缩,生成的后缀是“.gz”brotliCompress
:使用 Brotli 压缩算法进行压缩,生成的后缀是“.br”deflate
:使用 deflate 压缩算法进行压缩,生成的后缀是“.z”deflateRaw
:使用 deflate 压缩算法进行压缩,但是不使用任何字典,生成的后缀也是“.z”
在选择使用哪种压缩算法时,需要考虑以下几个因素:
- 压缩比:不同的压缩算法可以达到不同的压缩比,一般来说,
Brotli
压缩算法的压缩比最高,其次是gzip
和deflate
,而deflateRaw
的压缩比最低。 - 解压缩时间:不同的压缩算法解压缩时间不同,一般来说,
gzip
和deflate
的解压缩时间较短,Brotli
和deflateRaw
的解压缩时间较长。 - 浏览器支持度:不同的压缩算法在浏览器中的支持度也不同,一般来说,
gzip
是最常用的压缩算法,几乎所有现代浏览器都支持它。而Brotli
压缩算法在一些较老的浏览器中可能不被支持。
在选择使用哪种后缀时,需要考虑以下几个因素:
- 文件类型:不同的后缀适用于不同的文件类型,例如
.gz
通常用于文本文件的压缩,.br
通常用于图片和网页的压缩等。 - 兼容性:不同的后缀在不同的操作系统和软件中可能存在兼容性问题,例如一些早期的软件可能只支持
.z
后缀的压缩文件。 - 个人偏好:不同的开发者可能有不同的喜好和习惯,因此可能会选择不同的后缀来命名压缩文件。