@hb/vite-plugin-image-compress

压缩图片vite插件

用法

// 安装
npm install @hb/vite-plugin-image-compress
yarn add @hb/vite-plugin-image-compress
pnpm install @hb/vite-plugin-image-compress

// 使用
  // 图片压缩
  viteImageCompression({
    rootPath: getRoute(),     // 寻找该目录下的所有图片资源，默认是当前运行项目下所有目录
    force?: boolean,          // 强制压缩，跳过json记录查询，默认每次都读取配置
    disabledTiny ?: boolean,  // 是否关闭tinypng，默认不关闭tinypng图片压缩优化
    type?: 'Auto'|'TinyPng'|'ImageMin' // 指定压缩方式，默认是'Auto'，即使用两种方式一起压缩
    batch?: number,           // 一次接口请求几个图片，1-10， 默认是3
    options: {                // options参数和imagemin插件基本一致
      skipLargerFile: true,
      gifsicle: {
        optimizationLevel: 7,
        interlaced: false,
      },
      optipng: {
        optimizationLevel: 7,
      },
      mozjpeg: {
        quality: 75,
        progressive: true,
      },
      pngquant: {
        quality: [0.8, 0.9],
        speed: 4,
      },
      svgo: {
        plugins: [
          {
            name: 'removeViewBox',
          },
          {
            name: 'removeEmptyAttrs',
            active: false,
          },
        ],
      },
    }
  }),

背景

https://o15vj1m4ie.feishu.cn/docx/PW27dLIpYoyt4GxwC8RcaNvmnYd

逻辑流程图