grunt之watch续

　　上一回没有说完，我就是这样，做之前心中波澜壮阔，锦绣山河，等画完小草开始烦躁，完成鲜花出现动摇，然后心神涣散，最后虎头蛇尾。

　　现在弥补下之前遗漏的问题。

　　watch(V0.6.1)的tasks和options(github地址)

1. watch和之前介绍的plugin有几点不同，首先files的值不是原来对象数组的形式，而是监听的文件的路径的字符串数组。
   其次，其他plugin的task结构为target+options，watch多一个属性类型，叫tasks，是监听的文件变动后需要执行的任务队列。
   目录结构还是参照之前，源文件夹是src，目标文件夹是dest，先做一个简单的实现。

   'use strict';
   
   module.exports = function(grunt) {
   
       require('load-grunt-tasks')(grunt);
       require('time-grunt')(grunt);
   
       var path = {
           src: 'src',
           dest: 'dest'
       }
   
       grunt.initConfig({
           path: path,
           copy: {
               test: {
                   files: [
                       {
                           expand: true,
                           cwd: '<%=path.src%>/',
                           src: '{,*/}*',
                           dest: '<%=path.dest%>/'
                       }
                   ]
               }
           },
           watch: {
               test: {
                   tasks: [
                       'copy'
                   ],
                   files: '<%=path.src%>/{,*/}*'
               }
           }
       });
   
       grunt.registerTask('default', ['watch']);
   }

   执行grunt后，源文件夹下每有文件的变动，就会将所有文件复制到目标文件夹。

2. 开始介绍options
   spawn: 是否在子进程中执行tasks，默认为true。相当概念化的东东，换种方式理解。我们在module.exports = function(grunt) 函数的开头加上一句

   console.log('task name: ' + (process.argv[2] || 'default'));

   process的nodejs中的api，这句话是打印输入的命令的第二个字符串即执行的task。比如你执行grunt default，第二个字符串就是default，执行grunt，第二个字符串就是undefined。
   再次执行grunt，打印出来的内容如下

   task name: default
   Running "watch" task
   Waiting...

   然后修改源文件夹下的内容，接下来显示的内容如下

   >> File "src\index.html" changed.
   task name: copy
   Running "copy:test" (copy) task
   Created  directories, copied  files
   
   Done, without errors.
   
   Execution Time (-- :: UTC)
   loading tasks   3ms  ██████ %
   copy:test      22ms  █████████████████████████████
   ███████████ %
   Total 26ms
   
   Completed in .309s at Tue Jan   :: GMT+ (台北標準時間) - Waitin
   g...

   又打印出了task name这一行，这意味着当设置此option为true时，每次执行watch中设置的task，都相当于在命令行再次输入grunt taskname。我们把此options设置为false，做同样的操作。

   task name: default
   Running "watch" task
   Waiting...
   >> File "src\index.html" changed.
   
   Running "copy:test" (copy) task
   Created  directories, copied  files
   
   Running "watch" task
   Completed in .043s at Tue Jan   :: GMT+ (台北標準時間) - Waitin
   g...

   没有再次执行输出task name的代码。

   所以，如果你的Gruntfile.js中读取了输入命令的部分值并保存为变量，请将此option设置为false，不然watch启动的task中将读取不到这些变量。

3. interrupt: 如果新的变动产生时之前watch启动的task还没执行完，是否中断执行，默认为false
4. debounceDelay: 文件变动产生event的最小时间间隔，默认为500ms
5. event: 触发监听器的文件变动event类型，可选参数'all'(default)、'changed'、'added'、'deleted'
6. reload: 是否重新执行之前执行的命令，一般用于监听Gruntfile.js的变动，默认为false，保持之前spawn的代码，为watch添加一个target

   config: {
       options: {
           reload: true,
           spawn: false    //按之前spawn的设置将只会打印一次task name
       },
       files: 'Gruntfile.js'
   }

   执行grunt watch，然后修改Gruntfile.js，打印出来的内容

   task name: watch
   Running "watch" task
   Waiting...
   
   Reloading watch config...
   task name: watch
   
   Running "watch" task
   Waiting...
   >> File "Gruntfile.js" changed.
   
   Running "watch" task
   Completed in .017s at Tue Jan   :: GMT+ (台北標準時間) - Waitin
   g...

   可见无视了spawn的设定，在本进程重新执行了原来的命令。

7. dateFormat: Function，默认就是上面打印出来的时间
8. atBegin: 是否在watch开启的时候执行一遍设定的tasks，默认false，样例中设置为true则执行grunt时会先进行一次copy
9. livereload: 前一节已经提到过了
10. cwd: 因为files不支持设置cwd，所以这里有个这样的option，和files中的功能一样
11. livereload: task执行错误的时候是否进行livereload操作，默认为true

　　至此常用的plugin基本介绍结束，当然还有jshint、htmlmin、imagemin等，github上的链接已经给出，相信看过之前介绍的plugin会养成一种上github看文档的习惯。

　　下一篇介绍下module.exports = function(grunt){}中传入参数grunt的api，应该也是grunt系列的最后一篇了。