Question

好吧，我已经设置了Grunt来连接和删除所有我的JS文件，我也设置它来运行我的sass文件。这工作正常，我设置了监视调用以观察所有.js和.scss文件，然后它运行为每个设置的任务。

我正在使用backbone.js，因此每次我对其中一个文件进行更改时都会有很多库文件联系，这不是自己的问题，但是当任何sass文件发生变化时，它即使没有更改我的任何js文件，也会同时运行我的闭包编译器。

所以我做了一些研究，从这里找到的一些问题/答案看起来我可以设置两个监视功能来观察不同的文件夹，并在每个监视文件夹上更改文件时运行设置任务。简单吧？如果是这样的话我不知道出了什么问题，但是它只会看第一套任务，第二套它不会同时观看？

我知道JavaScript是非阻塞的，但是监视任务是一个阻塞任务，根据我的理解（如果我错了请纠正我）当我的第一个看电话启动时，它会停止运行第二个看电话？

然后我发现了并发，我认为这会解决我的问题。但它只是做同样的事情，第一次看电话似乎停止了第二次运行，而咕噜正在观看我的第一组文件夹。

这是当前的grunt文件代码：

 module.exports = function(grunt) {

 // Project configuration.
 grunt.initConfig({
   pkg: grunt.file.readJSON('package.json'),

concurrent: {
    options: {
                logConcurrentOutput: true
            },
    target1: ['watch:ScssFiles'],
    target2: ['watch:JSFiles']
}, //End of Concurrent

'closure-compiler': {
    frontend: {
      closurePath: '/usr/lib',
      cwd: 'raw_assets/javascript/',
      js: ['jquery-2.1.0.js','underscore.js','backbone.js','vars.js','bb_models.js','bb_collections.js','bb_views.js','master.js'],
      jsOutputFile: 'assets/js/showcase_master.js',
      options: {
        compilation_level: 'SIMPLE_OPTIMIZATIONS',
        language_in: 'ECMASCRIPT5_STRICT',
      }//End of Options 
    } //End of frontend
}, //End of Closure Compiler

sass: {                             
    dist: {   
      options: {                    
        style: 'compressed'
      }, //End of Options
      files: {                        
        'assets/css/Master.css': 'raw_assets/sass/main.scss'    
      } //End of Files
    } //End of Dist.
}, //End of SASS

watch: {
  'JSFiles': {
    files: [ 'raw_assets/javascript/*.js' ],
    tasks: ['closure-compiler'],
    options: {
      spawn: false,
    },
  }, //End of Watch call for JS Files
 'ScssFiles': {
    files: ['raw_assets/sass/*.scss'],
    tasks: ['sass'],
    options: {
      spawn: false,
    }, 
  } //End of Watch SCSS Files
} //End of Watch


});

// Load the plugins
grunt.loadNpmTasks('grunt-closure-compiler');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-concurrent');

//When 'Grunt' is run perform watch function
grunt.registerTask('default', ['concurrent:target2', 'concurrent:target1']);#

}; //End of GruntFile

所以我真正想要的是，这个grunt文件可以同时监视两个文件夹，并且只有在更改该组中的文件时才执行我需要的操作/任务，这是否可行？

我确实（或者至少认为我这样做）有一个解决方法，我在Windows上开发但是有一个运行Ubuntu服务器的虚拟机。我在一个putty终端里面运行我的grunt文件。在这种情况下，我可以有两个putty终端，一个设置为一个监视js文件，另一个监视我的scss文件。这种设置是否更容易实现？

欢迎大家帮助。

格伦。

PS。对不起，如果我的拼写是关闭的，我是阅读障碍，也可能没有解释正确的事情，所以让我知道，我会改进我的措辞，谢谢。

Answer 1

grunt-concurrent不是必需的，grunt-contrib-watch可以按照您定义的方式查看多个目录。我掏空你的档案试试看，发现了两个问题

Grunt任务名称似乎不允许使用连字符。
grunt watch不会挂起。一旦有东西存在，它就会暂停。

以下是简化版本：

module.exports = function(grunt) {

 // Project configuration.
 grunt.initConfig({

watch: {
  'JSFiles': {
    files: [ 'raw_assets/javascript/*.js' ],
    tasks: ['closure_compiler'],
    options: {
      spawn: true,
    },
  }, //End of Watch call for JS Files
 'ScssFiles': {
    files: ['raw_assets/sass/*.scss'],
    tasks: ['sass'],
    options: {
      spawn: true,
    }, 
  } //End of Watch SCSS Files
} //End of Watch


});

// Load the plugins
grunt.loadNpmTasks('grunt-contrib-watch');

//When 'Grunt' is run perform watch function
grunt.registerTask('closure_compiler', function() {
   grunt.log.writeln("in closure_compiler");
});

grunt.registerTask('sass', function() {
   grunt.log.writeln("in sass");
});

}; //End of GruntFile

然后我运行npm install grunt grunt-cli grunt-contrib-watch，并使用raw_assets和javascript子目录创建了sass目录。然后我创建了一个空的JS文件和SCSS文件，并运行grunt watch。

任何两个子目录中的任何修改都会执行正确的任务。

$ grunt watch
Running "watch" task
Waiting...OK
>> File "raw_assets/sass/foo2.scss" added.

Running "sass" task
in sass

Done, without errors.
Completed in 0.381s at Mon Mar 03 2014 00:21:46 GMT+0100 (CET) - Waiting...
OK
>> File "raw_assets/javascript/new.js" added.

Running "closure_compiler" task
in closure_compiler

Done, without errors.
Completed in 0.381s at Mon Mar 03 2014 00:27:50 GMT+0100 (CET) - Waiting...

Grunt.js - 同时同时观看两个观看任务？

1 个答案: