Webpack imagemin 插件来压缩 jpg、png 和创建 webp？

Question

我正在尝试弄清楚如何使用 webpack 以最佳方式压缩我的图像。我正在寻找一种压缩 .jpg（有损）、.png 以及为每个 jpg/png 文件创建 .webp 文件的方法。

我尝试了 https://github.com/itgalaxy/imagemin-webpack，它似乎可以输出 .jpg 和 .png 文件，但我无法开始输出 .webp，即使它说它应该支持其他 imagemin-packages。

我当前对该插件的配置是：

const imageMinPlugin = new ImageminPlugin({
    imageminOptions: {
        plugins: [
            ['webp', { quality: 50 }],
            ['mozjpeg', { quality: 10 }],
            ['pngquant', { quality: [0.9, 0.95]}],
        ]
    }
});

但是好像完全忽略了"webp"部分，没有报错什么的。有没有更好的方法来使用满足我要求的 webpack 压缩图像？或者我需要以不同的方式执行此操作吗？

Answer 1

已经有答案，虽然问题不完全相同。

我猜你想念的是 imageminWebp 函数。您可以在链接的存储库 (webpack.common.js lines 22-26) 中查看它。

Webpack imagemin 插件来压缩 jpg、png 和创建 webp？

Webpack imagemin plugin to compress jpg, png and create webp?

javascript

image-compression

npm

webp

webpack