前端项目构建之Yeoman

前端项目构建之Yeoman

转自博客园博主，没找到出处，侵权删。

1. yeoman(脚手架工具):http://yeoman.io/
2. bower(包管理工具):http://bower.io/

3. grunt(构建工具):http://www.gruntjs.net/

   一:准备工作由于这三个工具都是需要利用npm包下载的,所以需要安装node.js进入到node.js官网https://nodejs.org/en/你会看到两个绿色的大按钮,选择稳定版本的node.js安装就行,安装过程就不细说了,全程傻瓜式安装,下一步,下一步。。就行了,当你安装完node的时候,说明我们已经成功了三分之一,还有三分之二需要我们去完成。剩下的三分之二也是本次讲解的干货,希望对各位能够有所帮助。好了,干货走起,敌军还有三十秒到达战场,碾碎他们。

   1.安装完node后打开终端输入node -v 出现下图则说明安装成功。

2.安装git

Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。Yeoman自动构建项目时会用到该软件,所以我们先安装好。到Git官网http://git-scm.com/download/上下载并安装,安装过程和node一样遵循傻瓜式安装

3.安装yeoman,grunt,bower
在命令提示符中运行npm install -g yo grunt-cli bower

4.安装generator在命令行输入yo

5.使用yeoman构建项目,俗话说养兵xx,用兵xx,(ps:原谅我语文是体育老师教的,忘记那句话咋说的了)

创建一个工作目录,用于存放Yeoman项目。我在D盘下新建Angular的app工作目录,命令行进入,输入yo命令,用上下键选择webapp

这里我们不选择Sass,因为需要Sass的话运行环境是Ruby,在windows下配置会非常麻烦;选择bootstrap;不选择Modernizr;点击回车,经过几屏的信息滚动后,会提示项目构建完成,文件目录如下:

app 为项目主目录,是部署的根目录

node_modules 为 nodejs的包文件

test 为测试目录,专门用于单元测试,用的是 mocha 来测试

Gruntfile.js 是配置 grunt 自动化任务的配置文件,具体配置可以参考下 Grunt官网