從無到有建立一個grunt項目

在安裝好grunt的前提下建立一個grunt的項目：

一、首先建立一個項目文件

就叫grunt-project

二、進入這個文件

建立一個index.html

在建立一個js文件，進去建立一個index.js

三、回到根目錄

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文件

在項目根目錄下執行(無論是老項目仍是新建的項目均可以這樣執行)

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文件