Question

我有一个Gulp任务为src文件夹中的.svg文件创建.png后备：

gulp.task('svg2png', ['svg'], function() {
  return gulp.src(src + '/svg/**/*.svg')
  .pipe(plugins.newer(dest + '/svg'))
  .pipe(plugins.svg2png())
  .pipe(gulp.dest(dest + '/svg'))
  .pipe(plugins.notify({
    message: 'svg2png task complete', onLast: true
  }));
});

（svg任务是svgmin）

我想通过删除生成的文件（在dest文件夹中）来整理自己，并考虑扩展监视任务，如下所示：

gulp.task('watch', function () {
  var watchSvg = gulp.watch('src/svg/**/*.svg', ['svg2png']);

  watchSvg.on('change', function(event) {
    if (event.type === 'deleted') {
      var filePathFromSrc = path.relative(path.resolve('src'), event.path);
      var destFilePath = path.resolve('dist', filePathFromSrc);
      del.sync(destFilePath);
    }
  });
});

这可以删除.svg但我还想做的是删除匹配的.png文件，这样就没有孤儿了。我盲目地相信Handling the Delete Event on Watch recipe所以我已经超出了我的Gulp / JS知识水平来试验这个修改。

提前致谢。

Answer 1

假设.png文件生成到与缩小的.svg文件相同的文件夹中，则以下内容应该有效：

watchSvg.on('change', function(event) {
  if (event.type === 'deleted') {
    var filePathFromSrc = path.relative(path.resolve('src'), event.path);
    var destFilePath = path.resolve('dist', filePathFromSrc);
    del.sync(destFilePath);
    var pngDestFilePath = destFilePath.replace(/.svg$/, '.png');
    del.sync(pngDestFilePath);
  }
});

Gulp：当从.svg中删除.svg时，从dest中删除生成的.png

1 个答案: