如何防止在更新多个文件时多次实时重新加载 grunt

How to prevent grunt from live reloading multiple times when multiple files are updated?

本文关键字：新加载 实时 加载 grunt 何防止 更新 文件      更新时间：2023-09-26

我有一个繁重的监视任务，其中包含多个子任务，用于观看LESS，CoffeeScript等。

    watch:
        jade:
            files: ['<%= yeoman.app %>/*.jade']
            tasks: ['jade']
        less:
            files: ['<%= yeoman.css %>/*.less']
            tasks: ['less']
        coffee:
            files: ['<%= yeoman.scripts %>/*.coffee']
            tasks: ['coffee']
        edge:
            files: ['<%= yeoman.comp %>/*']
            tasks: ['edge']
        livereload:
            options:
                livereload: true
            files: [
                '<%= yeoman.app %>/*.html'
                '<%= yeoman.css %>/*.css'
                '<%= yeoman.scripts %>/*.js'
            ]

我还有一个我编写的自定义任务，负责处理一组经常更新的第三方文件。任务更新第三方 javascript 和 html 文件中的多个路径，然后将它们重新分发到主项目中的适当位置。

问题是，当这些文件中的每一个都写入其目的地时，相关的 grunt 任务会运行，每个文件都会触发实时重新加载。因此，如果写入 4 个文件，则会发生 4 次单独的重新加载。

有没有办法配置监视任务以将所有实时重新加载事件合并到"结束"的单个重新加载中？

我个人还没有尝试过，但你可能会发现 tiny-lr 值得研究。如果您正在编写自定义任务，那么您可以将请求发布到 tiny-lr 服务器以一次重新加载多个文件（您可以通过 grunt-shell 之类的东西执行此操作）：

# notify a single change
curl http://localhost:35729/changed?files=style.css
# notify using a longer path
curl http://localhost:35729/changed?files=js/app.js
# notify multiple changes, comma or space delimited
curl http://localhost:35729/changed?files=index.html,style.css,docs/docco.css

我不确定标准配置是否可以自行满足您的要求，但值得一试：

grunt.loadNpmTasks('tiny-lr');
grunt.initConfig({
  watch: {
    reload: {
      files: ['**/*.html', '**/*.js', '**/*.css', '**/*.{png,jpg}'],
      tasks: 'tinylr-reload'
    }
  }
});
grunt.registerTask('reload', ['tinylr-start', 'watch']);

还有 grunt-new，它只根据更改的文件运行任务。我在手表设置中使用它，它节省了大量时间，因为它不必每次只保存一个文件时处理每个文件。

希望这有帮助。

相关文章：