首先分享几个别人的博客，很详细，能看完跟着做一遍的话基本就会了
http://yujiangshui.com/grunt-basic-tutorial/
http://developer.51cto.com/art/201506/479127.htm#topx
http://zhangzhaoaaa.iteye.com/blog/2113526
http://www.cnblogs.com/artwl/p/3449303.html
其次：
总结的步骤有点乱。
grunt的安装：
1.在安装nodejs的基础上，安装grunt-CLI，即：npm install -g grunt-cli
2.在项目文件夹例如demo2下建立两个空文档：Gruntfile.js和package.json
3.在项目文件夹路径下执行npm install grunt --save-dev
接着再执行grunt命令
4.配置Gruntfile.js文件，配置完后再运行grunt命令
5.安装需要的插件，比如压缩js代码用的uglify插件。npm install grunt-contrib-uglify --save-dev 此时package.json的devDependencies中会有改变，同时要接着配置Gruntfile.js文件，完整的如注意事项2所示
//可一次安装多个插件
6.再运行grunt。则在相应的目的文件夹下就会产生对应压缩文件
其中jshint插件是检查js语法，csslint是检查css语法错误
以上执行了多次grunt，不够自动化，因此可以使用watch插件，实现真正的自动化
注意事项：1.在package.json文件的依赖中，如果没有写，而是在安装插件的时候自动填入，
则需要--save-dev的意思就是在当前目录安装grunt的同时，顺便把grunt保存为这个目录的开发依赖项，
即package.json的devDependencies中
2.Gruntfile.js文件的具体写法如下： 即：任务配置代码，插件加载代码，任务注册代码
module.exports = function (grunt) {
grunt.initConfig({
pkg:grunt.file.readJSON('package.json'),//将我们的配置文件读出，并且转换为json对象
cssmin: { //css文件压缩
css: {
src:'src/test.css', //源文件位置，
dest:'build/<%= pkg.name %>-<%=pkg.version%>.min.css' //目的文件位置及名字
}
}
});
grunt.loadNpmTasks('grunt-css'); //用于加载相关插件
grunt.registerTask('default', ['cssmin']);//注册一个自定义任务（其实也是默认任务）
}
3.
如果不混淆变量名，比如原js里面是aaaa+b，后边是压缩后是n+b。这样就改变了变量名，要想仍是aaaa，则需要在Gruntfile.js中配置
mangle: false, //不混淆变量名
详见第四个博客
画外音：
让 Grunt 帮忙实现下面几个功能：检查每个 JS 文件语法、合并两个 JS 文件、将合并后的 JS 文件压缩、将 SCSS 文件编译、新建一个本地服务器监听文件变动自动刷新 HTML 文件。
差不多就是这些，根据这些任务需求，需要用到：
合并文件：grunt-contrib-concat
语法检查：grunt-contrib-jshint
Scss 编译：grunt-contrib-sass
压缩文件：grunt-contrib-uglify
监听文件变动：grunt-contrib-watch
建立本地服务器：grunt-contrib-connect
