grunt学习随笔

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

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

2.1package.json配置实例

 1 {{
 2   "name": "web",
 3   "version": "2.1.0",
 4   "description": "A simple ui framework based on Zepto",
 5   "author": "Vistim",
 6   "license": "BSD",
 7   "readmeFilename": "README.md",
 8   "devDependencies": {
 9     "connect-livereload": "latest",
10     "grunt": "^1.0.1",
11     "grunt-contrib-concat": "^1.0.1",
12     "grunt-contrib-connect": "^1.0.2",
13     "grunt-contrib-copy": "^1.0.0",
14     "grunt-contrib-imagemin": "^0.8.1",
15     "grunt-contrib-jshint": "^0.12.0",
16     "grunt-contrib-less": "^1.3.0",
17     "grunt-contrib-livereload": "^0.1.2",
18     "grunt-contrib-uglify": "^1.0.1",
19     "grunt-contrib-watch": "^1.0.0",
20     "grunt-jsbint": "0.0.7",
21     "grunt-size": "^0.1.2",
22     "grunt-targethtml": "^0.2.6",
23     "grunt-tmod": "^0.2.10"
24   }
25 }

 

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 命令。

 

 

转载于:https://www.cnblogs.com/zzcit/p/5551919.html