javascript - nodejs - 以编程方式运行 grunt 任务

Question

我正在使用 grunt 任务来观看 和连接 一些 js 文件。

我的第一个配置运行良好:

grunt.initConfig({
    watch: {
      js: {
        files: ['web/**/*.js'], 
        tasks: ['concat:JS'] 
      }
    },
    concat: { 
      JS: {
        files: {
          "index.js": [
            "test-1.js",
            "test-2.js",
          ],
          "about_us.js": [
            "test-3.js",
            "test-4.js",
          ],
          "store.js": [
            "test-5.js",
            "test-6.js",
          ]
        }
      }
    }
  });

我的问题是，每当我更改文件时，使用此配置它都会连接所有内容。

我将能够仅连接特定文件(基于更改的文件)。

例如如果我更改 test-1.js 我只想连接 index.js 文件(..所以要运行的任务应该是 'concat:JS: index.js' )

所以我尝试添加一个观看事件

 grunt.event.on('watch', function(action, filepath, target) {
        var taskName = "concat:JS"; //here i calculate dinamically the specific task name to be run
        grunt.task.run(taskName);
    });

但什么也没发生……有什么想法吗？谢谢

Answer 1

问题的新答案帖子编辑

使用 grunt.event.on('watch', ...) 监听器不是满足此类要求的错误工具。相反，您应该使用多个 Targets对于 watch 和 concat 任务，如下面的 Gruntfile.js 摘录所示。

Gruntfile.js

grunt.initConfig({
  watch: {
    'JS-index': {
      files: ['web/js/test-1.js', 'web/js/test-2.js'], 
      tasks: ['concat:JS-index']
    },
    'JS-about-us': {
      files: ['web/js/test-3.js', 'web/js/test-4.js'], 
      tasks: ['concat:JS-about-us']
    },
    'JS-store': {
      files: ['web/js/test-5.js', 'web/js/test-6.js'], 
      tasks: ['concat:JS-store']
    }
  },
  concat: { 
    'JS-index': {
      files: {
        'dist/js/index.js': [
          "web/js/test-1.js",
          "web/js/test-2.js",
        ]
      }
    },
    'JS-about-us': {
      files: {
        "dist/js/about_us.js": [
          "web/js/test-3.js",
          "web/js/test-4.js",
        ]
      }
    },
    'JS-store': {
      files: {
        'dist/js/store.js': [
          "web/js/test-5.js",
          "web/js/test-6.js",
        ]
      }
    }
  }
});

注意事项

鉴于上面显示的配置，通过 CLI 运行 grunt watch 后会发生以下情况:

1. 更改 test-1.js 或 test-2.js 会将两个文件连接到 dist/js/index.js.

2. 更改 test-3.js 或 test-4.js 会将两个文件连接到 dist/js/about_us.js.

3. 更改 test-5.js 或 test-6.js 会将两个文件连接到 dist/js/store.js.

您的路径需要根据需要进行配置

---

问题编辑前的原始答案

how do i execute a task with grunt?

使用 grunt.task.run是以编程方式运行任务的正确方法。

然而，看到这个comment在 grunt-contrib-watch github 仓库中。摘录如下:

"Don't use grunt.event.on('watch') to run your tasks."

和...

"The watch event is not intended for running tasks."

以下解决方案假设您的要求是在更改/编辑其中一个文件时连接一些 .js 文件。在这种情况下，您需要利用 watch 任务的 tasks 属性来定义要运行的任务(即 'concat:JS')

---

Gruntfile

module.exports = function(grunt) {

  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-concat');

  grunt.initConfig({
    watch: {
      js: {
        files: ['path/to/js/**/*.js'], // <-- 1. Glob pattern to .js files
        tasks: ['concat:JS'] // <-- 2. Task to run when .js file changes.
      }
    },
    concat: {  // <-- 3. Configure your `concat` task as necessary.
      JS: {
        src: [
          'path/to/js/foo.js',
          'path/to/js/bar.js',
          'path/to/js/quux.js'
        ],
        dest: 'path/to/output/combined.js'
      }
    }
  });

  grunt.registerTask('default', ['watch']);

  grunt.event.on('watch', function(action, filepath, target) {
    console.log("yep, this code is being executed");
    // 4. <-- Do not run task from 'on' listener event.
  });
}

---

注意事项

1. 在您的 watch 任务中定义源 .js 文件的 glob 模式以监视更改。
2. 指定当 .js 文件改变时运行的任务； IE。 'concat:JS'
3. 根据需要配置您的 concat 任务。
4. 从 grunt.event.on('watch', ...) 监听器中移除 grunt.task.run('concat:JS');。
5. 使用上面的要点并通过您的 cli 运行 grunt 会在对 .js 进行任何更改时创建一个新的 combined.js 文件文件存储在 path/to/js/ 目录中。 (您需要根据您的要求配置路径)
6. 虽然 grunt.event.on('watch', ...) 监听器不应用于运行任务，但它可用于配置其他任务。