gulp - 如何仅在新文件和更改文件上运行 gulp imagemin 任务？

Question

我尝试添加如下所示的 gulp 任务并运行 gulp 图像，以便它仅在添加/更改的文件上运行但是，这似乎不起作用......知道吗？

  gulp.task('images', function (event) {
  switch (event.type)
  {
    case 'added':
    case 'changed':
      gulp.src(event.path)
        return gulp.src(config.images.src)
        .pipe(imagemin({
          optimizationLevel: 5,
          progressive: true,
          svgoPlugins: [{removeViewBox: false}],
          use: [pngcrush()]
        }))
        .pipe(gulp.dest(config.images.dest));
      break;
  }
});

Answer 1

您可以使用gulp-newer仅传递较新的文件。

在 imagemin 之前插入一个管道，以目标文件夹作为参数。

gulp.task('images', function (event) {
  gulp.src(event.path)
    return gulp.src(config.images.src)
    .pipe(newer(config.images.dest))
    .pipe(imagemin({
      optimizationLevel: 5,
      progressive: true,
      svgoPlugins: [{removeViewBox: false}],
      use: [pngcrush()]
    }))
    .pipe(gulp.dest(config.images.dest));
});

Answer 2

除了gulp-newer@Headwiki 提到的，另一个流行的工具是gulp-changed.

根据您的确切需求gulp-newer或gulp-changed可能更好……或者对于您的项目，它可能不会有所不同。有关更多信息，请参阅问题“gulp-newer vs gulp-changed？”