在安装好grunt的前提下建立一个grunt的项目:html
一、首先建立一个项目文件git
就叫grunt-projectnpm
二、进入这个文件json
建立一个index.htmlvim
在建立一个js文件,进去建立一个index.jsbash
三、回到根目录grunt
cd ..
终端命令为测试
1 haonandeMacBook-Pro:workspace haonan$ mkdir grunt-project 2 haonandeMacBook-Pro:workspace haonan$ cd grunt-project 3 haonandeMacBook-Pro:grunt-project haonan$ vim index.html 4 haonandeMacBook-Pro:grunt-project haonan$ mkdir js 5 haonandeMacBook-Pro:grunt-project haonan$ cd js 6 haonandeMacBook-Pro:js haonan$ vim index.js 7 haonandeMacBook-Pro:js haonan$ cd.. 8 -bash: cd..: command not found 9 haonandeMacBook-Pro:js haonan$ cd ..
四、建立package.json文件ui
在项目根目录下执行(无论是老项目仍是新建的项目均可以这样执行)this
1 npm init
会提示
1 Press ^C at any time to quit. 2 name: (grunt-project) 3 version: (1.0.0) //版本号 4 description: learn grunt prohject //项目运行时的描述 5 entry point: (index.js) //项目的入口文件 6 test command: //测试命令 7 git repository: //git仓库地址 8 keywords: grunt //关键词 9 author: haonan //做者 10 license: (ISC) //协议 11 About to write to /Users/leleda002/workspace/grunt-project/package.json: 12 13 { 14 "name": "grunt-project", 15 "version": "1.0.0", 16 "description": "learn grunt prohject", 17 "main": "index.js", 18 "scripts": { 19 "test": "echo \"Error: no test specified\" && exit 1" 20 }, 21 "keywords": [ 22 "grunt" 23 ], 24 "author": "haonan", 25 "license": "ISC" 26 } 27 28 29 Is this ok? (yes) yes
这个时候在项目下就会多出一个package.json文件
看这个文件 就发现没有关联dependence
五、关联dependence,也就是引入grunt,在项目根目录下执行
1 npm install grunt --save-dev
六、接下来要用什么插件安装什么插件,例如
1 npm install load-grunt-tasks --save-dev 2 --save-dev是为了让直接改变保存到package.json文件中
七、生成gruntfile.js文件
1 vim gruntfile.js
编写gruntfile.js文件