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",
          ]
        }
      }
    }
  });

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

我可以仅连接特定文件（根据更改的文件）。

e.g。如果我改变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', ...)侦听器是这种要求的错误工具。相反，您应该对watch和concat任务使用多个Targets，如下面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后会发生以下情况：

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

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

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

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

编辑前的原始答案


如何使用grunt执行任务？

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

但是，请参阅grunt-contrib-watch github repo中的comment。摘录如下：


＆＃34;请勿使用grunt.event.on('watch')来执行您的任务。＆＃34;

和...


＆＃34;观看活动不适合运行任务。＆＃34;

以下解决方案假设您的要求是在更改/编辑其中一个文件时连接某些.js个文件。在这种情况下，您需要利用tasks任务的watch属性来定义要运行的任务（即'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. }); }

备注

在watch任务中，定义源.js文件的glob模式以观察更改。

指定.js文件更改时要运行的任务;即'concat:JS'

根据需要配置concat任务。

从grunt.task.run('concat:JS');听众中删除grunt.event.on('watch', ...)。

使用上面的要点并通过cli运行grunt会在对combined.js目录中存储的.js文件进行任何更改时创建新的path/to/js/文件。 （您需要根据您的要求配置路径）

虽然不应该使用grunt.event.on('watch', ...)侦听器来运行任务，但可以使用它来配置其他任务。

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

1 个答案:

新答案帖子编辑问题

编辑前的原始答案