1.0.1 • Published 1 year 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后缀的压缩文件。 - 个人偏好:不同的开发者可能有不同的喜好和习惯,因此可能会选择不同的后缀来命名压缩文件。