grunt学习随笔

1 grunt 安装  全局安装 npm install -g grunt-cli

2 配置好package.json 和 Gruntfile 文件，这两个文件必须位于项目根目录下。

2.1package.json配置实例

 {{
   "name": "web",
   "version": "2.1.0",
   "description": "A simple ui framework based on Zepto",
   "author": "Vistim",
   "license": "BSD",
   "readmeFilename": "README.md",
   "devDependencies": {
     "connect-livereload": "latest",
     "grunt": "^1.0.1",
     "grunt-contrib-concat": "^1.0.1",
     "grunt-contrib-connect": "^1.0.2",
     "grunt-contrib-copy": "^1.0.0",
     "grunt-contrib-imagemin": "^0.8.1",
     "grunt-contrib-jshint": "^0.12.0",
     "grunt-contrib-less": "^1.3.0",
     "grunt-contrib-livereload": "^0.1.2",
     "grunt-contrib-uglify": "^1.0.1",
     "grunt-contrib-watch": "^1.0.0",
     "grunt-jsbint": "0.0.7",
     "grunt-size": "^0.1.2",
     "grunt-targethtml": "^0.2.6",
     "grunt-tmod": "^0.2.10"
   }
 }

2.2 grunt常用插件功能（在package.json里面有使用插件列表及版本号）

contrib-jshint——javascript语法错误检查；

contrib-watch——实时监控文件变化、调用相应的任务重新执行；
contrib-clean——清空文件、文件夹；
contrib-uglify——压缩javascript代码
contrib-copy——复制文件、文件夹
contrib-concat——合并多个文件的代码到一个文件中
karma——前端自动化测试工具

2.3在使用contrib-jshint的时候需要配置.jshintrc文件

{
  "boss":false,
  "urly":true,
  "eqeqeq":true,
  "eqnull":true,
  "expr":true,
  "immed":true,
  "newcap":true,
  "noempty":true,
  "noarg":true,
  "regexp":true,
  "browser":true,
  "devel":true,
  "node":true
}

3 运行grunt

　　将命令行的当前目录转到项目的根目录下。命令行操作 "cd" +路径 回车进入目录.进入桌面可通过cd desktop 进入

　　执行npm install命令安装项目依赖的库。（能否直接根据配置文件进行自动安装）

　　执行 grunt 命令。