使用gulp-imagemin和imagemin-jpeg-repress插件？

Question

我只是嘗試用Gulp來簡單地優化圖像。我發現imagemin-jpeg-recompress比gulp-imagemin附帶的默認優化程序減少了更多的JPG。我想知道是否有辦法使用gulp-imagemin，但換出imagemin-jpeg-recompress的jpegtran插件。

我似乎無法找到任何詳細的文檔，這可能會一起工作。

Answer 1

我要回答我自己的問題。我可能是錯的，但它似乎是一個簡單的過程。只需require插件（在這種情況下，我想使用imagemin-jpeg-recompress插件）。然後通過imagemin的use屬性指定要在imagemin內使用的插件。我相信這將覆蓋imagemin附帶的捆綁jpegtran優化程序。

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' 
     })] 
    })) 
}); 

Answer 2

在gulp-imagemin的新版本（3.x）中，上述解決方案不起作用。原因是他們改變了聲明插件的方式，並將其配置爲數組語法和範圍參數。

的API的變化是documented in Release 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-repress（5.x）的新版本遵循此API。

全部放在一起，使用默認的插件（除了jpegtran，我們與JPEG-重新壓縮覆蓋），上面可以格式化爲答案如下：

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() 
    ])) 
}); 

Relevant discussion on gulp-imagemin github issue tracker