需求:先放在最前面：图片的压缩处理

最早的时候 我想写一个前端页面

然后通过canvas 在toDataURL 来进行压缩

但是 发现如果想把压缩图片这个事情 当成一个批量自动化服务的话 ，就没办法使用canvas了

所以我找了一个node的处理图片的库：squoosh/lib

npm地址：https://www.npmjs.com/package/@squoosh/lib

第一步下载包(0.4.0版本)

npm install @squoosh/lib

然后就一些固定代码了 没啥好说的

我封装了一层promise 用来进行批量处理的

const squoosh = require("@squoosh/lib");
const fs = require("fs");
const { ImagePool } = squoosh;

async function libSquooshOptimize(imagePath, filename, outputFolderPath) {
  return new Promise(async (resolve) => {
    const imagePool = new ImagePool();
    const image = await imagePool.ingestImage(imagePath);
    const preprocessOptions = {
      resize: {
        width: 330,
      },
    };
    await image.preprocess(preprocessOptions);
    const encodeOptions = {
      mozjpeg: "auto", // an empty object means 'use default settings'
      jxl: {
        quality: 100,
      },
      jpg: {
        quality: 100,
      },
    };
    await image.encode(encodeOptions);
    const { extension, binary } = await image.encodedWith.mozjpeg;
    fs.writeFileSync(`${outputFolderPath}/${filename}.${extension}`, binary);
    imagePool.close();
    resolve(true);
  });
}

调用示例：

libSquooshOptimize("./imgs/test.jpg","test","build/images")

这里比较有意思的地方 我需要说明一下：

正常来讲 不调整尺寸的情况下 设置quality就可以进行压缩

但是我发现这个参数不怎么生效，

所以只能强制的去调整尺寸 来控制图片的压缩效果

如果只设置了宽或高 任意一个 图片就可以自适应 且达到达到压缩效果

因为这个压缩图片在我的列表页面的尺寸也是固定的

所以在不改变原尺寸的情况下 进行图片压缩 对我来说不那么重要

可以实现我的需求

介意尺寸的 可以考虑其它的库