Gulpfile任务来复制文件应该优化图像(如果有)

时间:2018-07-01 17:29:36

标签: javascript gulp gulp-imagemin minimatch gulp-if

在gulpfile中,我正在复制多个文件(各种格式),如果这些文件中的任何一个包含图像,我都希望使用gulp-imagemin对其进行优化。

问题是gulp-imagemin期望仅图像,否则会在日志中抛出不支持的图像,因此,如果我要传递整个glob,则会抛出许多错误,因此我想避免这种情况。我尝试过gulp-if来过滤glob,尽管它可以作为过滤器并防止出现这些错误,但即使没有图像,它似乎总是至少通过一次。例如,即使没有png文件,它仍然会调用一次imagemin():

gulp.task('test:imagemin', function () {
  return gulp.src('*.nothing')
    .pipe(gulpif('*.png', imagemin({ verbose: true })));
});

这将记录“缩小的0张图像”,并且由于在我的实际情况下,我传递了数十个没有图像的glob,因此我的日志被垃圾邮件淹没了。如果我将gulpif条件设置为static false,则根本不会调用imagemin,因此它一定是某种情况下本应不为false的条件吗?

如果glob不包含某种类型的文件,我怎么根本不调用imagemin()?

2 个答案:

答案 0 :(得分:0)

gulpif与第一个参数中的函数一起使用。像这样:

gulpif(function(file) {
    return file.extname.toLowerCase() == '.png';
}, imagemin({ verbose: true }))

或者带有正则表达式(未经测试):

gulpif(/\.png$/i, imagemin({ verbose: true }))

答案 1 :(得分:0)

结果发现问题是gulp-if解决了该条件之前的问题。需要将条件置于乙烯流之外。因此,首先我同步了glob以获取文件,然后确定是否有任何受支持的图像并将其保存到bool中。然后,在调用gulp-if时,我必须调节此布尔值并嵌套在另一个gulp-if中进行过滤。

function copyFilesPipeline(assetGroup) {
  var containsImages = glob.sync(assetGroup.inputPaths).some(function (inputPath) {
    var ext = path.extname(inputPath).toLowerCase();
    return [".gif", ".jpg", ".png", ".svg"].includes(ext);
  });

  return gulp.src(assetGroup.inputPaths)
    .pipe(makeFilesLowercase())
    .pipe(gulpif(containsImages, gulpif('**/*.{gif,jpg,png,svg}', imagemin({ verbose: true }))))
    .pipe(newer(assetGroup.outputDir))
    .pipe(gulp.dest(assetGroup.outputDir));
}