Grunt - 如何查看和同步文件的删除答案

【问题标题】：Grunt - how to watch and synchronize files' deletionGrunt - 如何查看和同步文件的删除
【发布时间】：2013-09-09 10:24:40
【问题描述】：

我是 Grunt 的新用户。目前我有一个文件夹static_src/img，其中包含图像源文件（.psd）和图像文件（.png、.jpg 等）。此文件夹不公开。相反，我想将仅图像文件的更改同步到另一个公共文件夹static/img。

问题是 - 当我在 static_src/img 中添加/更改图像文件时效果很好，但我不知道如何在删除文件时同步更改。 grunt-contrib-watch 可以检测到static_src/img 中的删除，但是我不知道如何删除static/img 中的文件。我尝试了 grunt-contrib-clean，但它似乎对我不起作用，可能是我使用不正确。

我的 Gruntfile.js 是：

module.exports = function(grunt){
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    copy: {
      dev: {
        files: [
          {expand: true, cwd: 'static_src/img/', src:['**/*.{png,jpg,gif}'], dest: 'static/img/'}
        ]
      }
    },
    clean: {
      dev: {
        src: ['static_src/img/**/*.png']
      }
    },
    watch: {
      copy: {
        files: ['static_src/img/**/*.{png,jpg,gif}'],
        tasks: ['copy'],
        options: {
          event: ['added', 'changed'],
        }
      },
      remove: {
        files: ['static_src/img/**/*.{png,jpg,gif}'],
        tasks: ['clean'],
        options: {
          event: ['deleted']
        }
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-watch');
};

那么如何在 grunt-contrib-watch 任务中删除特定文件呢？谢谢你的帮助！

【问题讨论】：

标签： gruntjs grunt-contrib-watch

【解决方案1】：

对于已删除的事件，您可以删除static/img中的所有文件，并将static_src/img中剩余的文件复制到static/img中。

module.exports = function(grunt){
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    copy: {
      dev: {
        files: [
          {expand: true, cwd: 'static_src/img/', src:['**/*.{png,jpg,gif}'], dest: 'static/img/'}
        ]
      }
    },
    clean: {
      dev: {
        src: ['static/img/**/*.{png,jpg,gif}']    // Changed this from static_src to static
      }
    },
    watch: {
      copy: {
        files: ['static_src/img/**/*.{png,jpg,gif}'],
        tasks: ['copy'],
        options: {
          event: ['added', 'changed'],
        }
      },
      remove: {
        files: ['static_src/img/**/*.{png,jpg,gif}'],
        tasks: ['clean', 'copy'],    // Added copy task after clean
        options: {
          event: ['deleted']
        }
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-watch');
};

我猜这可能与您希望删除特定文件的方式不同，但可以正常工作。

【讨论】：

虽然这个方案看起来效率有点低，但我还是把它应用到我的项目中。因为： 1. 效率对于一个小项目的开发并不是很重要。 2.这种方法看起来更模块化。现在我不想直接调用 grunt api。有帮助，谢谢！

【解决方案2】：

Grunt 有一个file API，您可以利用它来处理事件，因此您可以编写一个删除函数，在删除给定的监视文件时运行：

grunt.event.on('watch', function(action, filepath, target) {
  if (action === 'deleted') {
    grunt.file.delete(fileToDelete);
  } 
});

文件路径已传入，因此您可以执行正则表达式之类的操作来获取文件名并在其前面加上适当的路径（如果需要）。

【讨论】：

【解决方案3】：

我强烈建议使用 nodejs 的 watch 包装器，它似乎比原生 fs.watch / fs.watchFile 更稳定（2013 年 12 月）和通用性。

https://github.com/paulmillr/chokidar

好吃的也是它的API：

  .on('add'
  .on('addDir'
  .on('change'
  .on('unlink'
  .on('unlinkDir'
  .on('error'

使用此模块时，我的粗略基准测试没有显示性能问题。

当然，这不是对您问题的完整答案，而是提示。希望对您有所帮助。

【讨论】：

【解决方案4】：

我为此做了一个任务：

https://github.com/taylorcode/grunt-delete-sync

希望这会有所帮助。当心破坏性。

【讨论】：

【解决方案5】：

试试我的duplicate，它可能适合您的需求。

如果源被删除，它会删除目标文件，并且它会在删除其内容后删除空文件夹。

【讨论】：

【解决方案6】：

使用grunt-rsync代替复制任务，可以使用delete option同步删除文件。

【讨论】：

【解决方案7】：

这是一个老问题，但对于 2016 年或以后登陆这里的任何人来说，现在有一个 grunt-sync 任务可以处理完整的同步，包括删除文件： https://github.com/tomusdrw/grunt-sync

【讨论】：