Gruntjs是前端项目构建工具，基于nodejs命令。有些js项目是基于Gruntjs构建的，如Jquery。
Gruntjs主要功能有：
1.合并文件。
2.压缩html,js,css,图片文件。
3.语法检测。
4.单元测试。
5.watch功能。
本文主要介绍watch配合chrome浏览器插件LiveReload实现网页自动刷新功能。
Nodejs安装
下载nodejs，官网地址 http://nodejs.org/ 下载最新版本按照提示下一步安装即可。
Gruntjs的安装
Gruntjs是基于Nodejs的，安装前要保证Nodejs环境成功安装，每个Gruntjs都包括两个文件：
1.package.json:依赖模块和用到的变量说明等，如：version,name。
2.Gruntfile.js:node module写法的任务管理文件。
package.json
例如我的package.json内容如下：
{
"name": "mitunes",
"version": "1.0.0",
"description": "mitunes",
"devDependencies": {
"grunt-shell": "~0.2.2",
"grunt-contrib-watch": "~0.4.4"
}
}
如果安装了新的插件，那么这个package.json会自动更新的，或者修改它然后执行npm install，也可以安装对应的插件。
Gruntfile.js
Gruntfile.js是node module格式的任务管理文件，如下：
module.exports = function(grunt) {
grunt.initConfig({
watch: {
files: ['../*.html','../js/*.js','../css/*.css'],
options: {
livereload: true
}
}
});
grunt.loadNpmTasks('grunt-contrib-watch');
};
运行Grunt
1.任意新建一个文件夹，例如：
D:work odejs，新建的nodejs文件夹然后添加package.json和Gruntfile.js文件
2.打开cmd进入到nodejs文件夹，运行 npm install命令，例如：
此时文件夹下多出一个文件夹node_modules。
3.输入命令grunt wacth，例如：
安装chrome浏览器插件LiveReload
例如：
完成
chrome打开你的网站使你的网站引用的静态文件指向Gruntfile.js中watch的文件或目录，开启liveReload插件，此时修改你的网站静态文件看到chrome自动刷新。
如何修改网站静态文件指向本地，参考：Fiddler的简单使用