Grunt是一个前端自动化工具，基于Node.js，可以实现自动前端代码维护，包括htmlhint，sass，jshint等工具方法的自动化实现。
安装：
首先安装Node。
其次安装npm。
下载npm源码
执行：
D:\>cd npmjs D:\npmjs>node cli.js install -gf
再次，安装grunt-cli。
npm install -g grunt-cli
最后，配置grunt。
1.创建package.json
{
"name": "grunt-test", "version": "0.1.0", "author": "yinqiao", "devDependencies": { "grunt": "~0.4.1", "grunt-contrib-jshint": "~0.6.3", "grunt-contrib-watch": "~0.5.3", "grunt-contrib-compass": "~0.6.0", "grunt-browser-sync": "~0.3.0", "grunt-contrib-sass": "~0.5.1", "grunt-contrib-uglify": "~0.2.7", "uglify-js": "~2.4.7", "htmlhint": "~0.9.3" }}2.创建gruntfile.js
module.exports = function(grunt){
grunt.initConfig({
//JSHint (http://www.jshint.com/docs)
jshint: { all: { src: 'assets/js/*.js', options: { bitwise: true, camelcase: true, curly: true, eqeqeq: true, forin: true, immed: true, indent: 4, latedef: true, newcap: true, noarg: true, noempty: true, nonew: true, quotmark: 'single', regexp: true, undef: true, unused: true, trailing: true, maxlen: 120 } } },//Uglify
uglify: { all: { files: { 'public/javascripts/all.min.js':'assets/js/*.js' } } },//Sass
sass: { options: { style: 'compressed', precision: 5 }, all: { files: { 'public/stylesheets/style.css':'assets/sass/style.scss' } } },//Htmlhint
htmlhint: { build: { options: { 'tag-pair':true, 'tagname-lowercase':true, 'attr-lowercase':true, 'attr-value-double-quotes':true, 'doctype-first':true, 'spec-char-escape':true, 'id-unique':true, 'head-script-disabled':true, 'style-disabled':true }, src:['index.html'] } },//watch
watch: { javascript: { files: 'assets/js/*.js', tasks: ['jshint','uglify'] }, sass: { files: 'assets/sass/*.scss', tasks: 'sass' }, html: { files:['index.html'], tasks:['htmlhint'] } }});
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-watch'); grunt.loadNpmTasks('grunt-contrib-uglify'); grunt.loadNpmTasks('grunt-contrib-sass'); grunt.loadNpmTasks('grunt-htmlhint');};3.创建index.js。创建资源目录assets。该目录下可有js、sass等文件夹，分别把不同的资源文件放置在相应的目录下。
4.运行grunt。
grunt watch
grunt jshint
grunt htmlhint
grunt sass
5.在运行的过程中，如遇到Warning: Task "uglify" not found. Use --fouce to continue.
即是没有安装uglify安装，通过命令进行安装：npm install uglify-js --save-dev。
使用--save-dev参数，安装该模块完成后会自动将该模块添加到package.json模块依赖关系中。
遇到其他模块没有完成安装的解决方法类似。
我的工程目录结构如下图所示：
modules
