3

我只是在尝试使用 Gulp 来简单地优化图像。我发现imagemin-jpeg-recompress比gulp-imagemin附带的默认优化器更能减少 JPG 。我想知道是否有一种方法可以使用gulp-imagemin但将jpegtran插件换成imagemin-jpeg-recompress.

我似乎找不到任何关于这如何协同工作的详细文档。

4

2 回答 2

4

我要回答我自己的问题。我可能是错的，但它似乎是一个简单的过程。只是require插件（在这种情况下，我想使用imagemin-jpeg-recompress插件）。然后imagemin通过. use_ 我相信imagemin这将覆盖.jpegtranimagemin

var gulp = require('gulp');
var imagemin = require('gulp-imagemin');
var imageminJpegRecompress = require('imagemin-jpeg-recompress');

gulp.task('optimize', function () {
  return gulp.src('src/images/*')
    .pipe(imagemin({
      use:[imageminJpegRecompress({
        loops:4,
        min: 50,
        max: 95,
        quality:'high' 
      })]
    }))
});
于 2015-06-22T14:17:50.413 回答
4

在 gulp-imagemin 的新版本 (3.x) 中，上述解决方案不起作用。原因是他们改变了插件声明和配置为数组语法和范围参数的方式。

API 更改记录在 3.0.0 版中

gulp.task('default', () => {
    return gulp.src('src/images/*')
-       .pipe(imagemin({
-           interlaced: true,
-           progressive: true,
-           optimizationLevel: 5,
-           svgoPlugins: [{removeViewBox: false}]
-       }))
+       .pipe(imagemin([
+           imagemin.gifsicle({interlaced: true}),
+           imagemin.mozjpeg({progressive: true}),
+           imagemin.optipng({optimizationLevel: 5}),
+           imagemin.svgo({plugins: [{removeViewBox: false}]})
+       ]))
        .pipe(gulp.dest('dist/images'));
 });

还要注意“如果你传入一个插件数组，你需要显式传入你想要的每个插件，而不仅仅是你想要更改选项的那些。”

新版本的 imagemin-jpeg-recompress (5.x) 遵循此 API。

综上所述，使用默认插件（除了 jpegtran，我们用 jpeg-recompress 覆盖），上面的答案可以格式化如下： 

var gulp = require('gulp');
var imagemin = require('gulp-imagemin');
var imageminJpegRecompress = require('imagemin-jpeg-recompress');

gulp.task('optimize', function () {
  return gulp.src('src/images/*')
    .pipe(imagemin([
      imagemin.gifsicle(),
      imageminJpegRecompress({
        loops:4,
        min: 50,
        max: 95,
        quality:'high' 
      }),
      imagemin.optipng(),
      imagemin.svgo()
    ]))
});

gulp-imagemin github issue tracker 的相关讨论

于 2016-07-08T02:25:16.517 回答