在 gulp-imagemin 的新版本(3.x)中,上述解决方案不起作用。原因是它们更改了插件的声明和配置方式,采用了数组语法和范围参数。
API 更改在“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-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问题跟踪器上的相关讨论