从无到有创建一个grunt项目

在安装好grunt的前提下创建一个grunt的项目：

1、首先创建一个项目文件

就叫grunt-project

2、进入这个文件

创建一个index.html

在创建一个js文件，进去创建一个index.js

3、回到根目录

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 ..

4、创建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

5、关联dependence,也就是引入grunt，在项目根目录下执行

1 npm install grunt --save-dev

6、接下来要用什么插件安装什么插件，例如

1 npm install load-grunt-tasks --save-dev
2 --save-dev是为了让直接改变保存到package.json文件中

7、生成gruntfile.js文件

1 vim gruntfile.js

编写gruntfile.js文件

posted @ 2017-02-12 22:43  haonanElva  阅读(721)  评论(0)  编辑  收藏  举报