我们已经学会了如何配置NodeJS Git Grunt 这章我们将要学习如何使用watch任务
如果还没有学习NodeJS Git Grunt的童鞋们请先阅读以下三章：
NodeJs教程: http://blog.csdn.net/itpinpai/article/details/48103845
Git教程: http://blog.csdn.net/itpinpai/article/details/48105445
Grunt教程:http://blog.csdn.net/itpinpai/article/details/48105541
什么是watch？
它是一个监听Task并执行对应的Task，watch在Gruntfile.js中有一个配置参数.
比如如果我们配置了一个copy的Task，告知watch如果有copy指定的文件修改了，如果监听到那些文件，就立即执行copy Task.
我要找到watch就先访问http://gruntjs.com/plugins 在search的输入框里输入：watch,在下面的列表中就显示出来相关的，我们选择第一个contrib-watch,原因他是我们要找watch.
细心的童鞋们可能发现了，为什么contrib-watch前面会有一个五角星呢？
答案：带五角星的代表是Grunt官网出品的插件Task, by Grunt Team.
不带的是Grunt爱好者提供的，我们也可以开发一个Grunt Task 提交到Grunt plugins 上去，但是前面不会出现五角星的。以后还会讲如何编写及发布一个grunt task。
打开watch：https://www.npmjs.com/package/grunt-contrib-watch
根据官网安装步骤
首先：安装插件：
npm install grunt-contrib-watch --save-dev
下一步：在Gruntfile.js文件中加载Npm插件任务
grunt.loadNpmTasks(‘grunt-contrib-watch‘);
下一步：在Gruntfile.js中配置watch，我们在之前学习安装Grunt时用到的grunt-contrib-copy插件的基础上来操作。
watch: {
copy: {
files: ‘<%=config.app%>/**/*.html‘,
tasks: [‘copy:dest‘]
}
}
配置好后，最后一步：在CMD命令窗口中执行 grunt watch 回车 看到如下图说明启动成功了，我们验证一下
先打开app中的aa.html文件，如下图：
再打开dist中的cc.html文件，如下图：
我们在aa.html中添加一句话：“Hello Grunt-contrib-watch” 保存一下。
我们再次打开dist中的cc.html 如果也看到了 “Hello Grunt-contrib-watch” 这句话，就说明watch安装成功了。
Gruntfile.js
/**
* Created by Administrator on 2015/8/23.
*/
‘use strict‘
module.exports = function (grunt) {
// 计划执行Task所需要的时间
require(‘time-grunt‘)(grunt);
// 加载Task任务
//require(‘load-grunt-tasks‘)(grunt);
// 下面二句相当于它require(‘load-grunt-tasks‘)(grunt);
grunt.loadNpmTasks("grunt-contrib-copy");
grunt.loadNpmTasks("grunt-contrib-clean");
grunt.loadNpmTasks(‘grunt-contrib-watch‘);
var config = {
app: "app",
dist: "dist"
};
grunt.initConfig({
config: config,
watch: {
copy: {
files: ‘<%=config.app%>/**/*.html‘,
tasks: [‘copy:dest‘]
}
},
// Task任务
copy: {
// 这是Task里的其中一个Target
dest: {
src: ‘<%=config.app%>/newFolder/aa.html‘,
dest: ‘<%=config.dist%>/newFolder/cc.html‘
}
},
clean: {
dest: {
expand: true, // 动态匹配
src: ‘<%=config.dist%>/**/**‘
}
}
});
// Task组合任务
grunt.registerTask("build", "description", function(dist){
grunt.task.run([
"copy:dest",
"clean:dest"
]);
});
};
这里我们只讲了如何安装一个插件并启用它，这里面还有一些其它的配置方式还没有讲到，如果童鞋们想研究更深得，那需要自行去多看一些API或网上的教程（https://www.npmjs.com/package/grunt-contrib-watch），多实践，先讲到这里，谢谢大家！
个人专业水平有限，欢迎大家批评纠正！