无法使用 imagemin-webp 将图像转换为 WebP

Question

我想使用 imagemin-webp 将多个 PNG 和 JPG 文件转换为 WebP 格式，而不是像 cwebp 一次只能转换一个文件。但是由于某些原因无法工作。

我已经完成的步骤：

1- 我安装了 Node JS v10.16.0；

2- 在我的项目目录下，我使用命令创建了 package.json 文件：npm init -y;

3- 仍然在项目目录中，我运行命令npm install imagemin imagemin-webp；

4- 然后我创建了一个名为 webp.js 的文件来保存应该转换图像的代码，并使用node webp.js 命令执行它。

以下是 webp.js 中的代码：

const imageminWebp = require('imagemin-webp');

imagemin(['_imgs/*.{jpg,png}'], '_imgs', {
   use: [
        imageminWebp({quality: 50})
    ]
}).then(() => {
    console.log('Images optimized');
});

我以为一旦执行代码，_imgs文件夹内的所有文件都会被转换成WebP格式，但当我查看文件夹时，那里只有PNG和JPG文件。

当我运行这段代码时，我收到“优化图像”的消息，但尽管如此，WebP格式的图片并没有生成。

是否还需要做其他的事情使其正常工作？

- Fb16455

Answer 1

我也遇到了同样的问题。

尝试这个：

const imagemin = require('imagemin');
const imageminWebp = require('imagemin-webp');

imagemin(['images/*.{jpg,png}'], {
  destination: __dirname + '/images/converted/',
  plugins: [
    imageminWebp({
      quality: 75,
      resize: {
        width: 1000,
        height: 0
      }
    })
  ]
}).then(() => {
  console.log('Images optimized');
});

当然你可以省略调整大小的部分；如果调整大小参数的某个部分为0，则会使用原始比例（例如对于2:3图像，如果输入1000，则会得到1000x1500）;

我仍然不知道如何转换单个图像...这非常难懂，而且文档不太好，尽管每周在npm上有超过30万次下载。

- firstdorsal

---

谢谢回复，非常有帮助！ - Fb16455

我现在正在使用“sharp”模块；好得多！ - firstdorsal

Answer 2

这是一个非常有效的代码。我发现使用gulp-ext-replace可以帮助重命名转换后的文件。 在项目目录中，从终端运行npm i -D gulp gulp-imagemin gulp-ext-replace imagemin-webp，然后在gulpfile.js中使用下面的代码片段。

const gulp = require("gulp");
const imagemin = require("gulp-imagemin");
const extReplace = require("gulp-ext-replace");
const webp = require("imagemin-webp");

// Simple task to convert png to webp
gulp.task("images:webp", function() {
  const stream = gulp
    .src("./public/images/**/*.png")
    .pipe(
      imagemin({
        verbose: true,
        plugins: webp({ quality: 70 })
      })
    )
    .pipe(extReplace(".webp"))
    .pipe(gulp.dest("./public/images"));
  return stream;
});

最初的回答：希望这能对你有所帮助 =)

- 0xe1λ7r

Answer 3

我在使用这个库时也遇到了同样的问题。 我试图为https://www.bestgift.in/order/cake/hyderabad转换大约10000张图片。 花了大约3天时间，但最终没有成功，最后我使用了谷歌提供的cwebp库，它运行得很好。

for file in *; do cwebp -q 80 "$file" -o "$file.webp"; done

更多信息请参见: https://developers.google.com/speed/webp

- Puja Kolli