Yeoman快速搭建Web开发框架

Yeoman是一个脚手架工具，可以自动化整合NodeJs/AngularJs/css/html等Web开发环境。

Yeoman主要包含了三个工具：yo、grunt、bower：

• yo：脚手架工具，主要作用是创建项目骨架（跟grunt-init有点像）。
• grunt：构建工具，主要用来运行各种任务，比如文件压缩、合并、打包等。
• bower：主要用来做前端资源依赖管理，跟npm很像，区别在于：npm管理的是node模块的依赖，bower管理的是前端资源的依赖，如css、javascript文件等。

1）安装node（同时安装npm）

CentOS等Linux操作系统可以从官方网站上下载node安装文件到本地安装。

1.1 下载安装nodejs
yum install gcc-c++ openssl-devel
wget http://nodejs.org/dist/v*.*.*/node-v*.*.*.tar.gz
tar –xvf node-v*.*.*.tar.gz
cd node-v*.*.*
./configure
make & make install 
cp -f node /usr/bin/node 

1.2 安装npm（npm是Node.js的包管理工具）
curl https://npmjs.org/install.sh | sh

2）安装grunt

grunt是一个对web前端进行打包的工具。

npm install grunt -g
npm install grunt-cli -g

3）安装bower

bower管理的是前端css+javascript框架(如JQuery)

npm install -g bower

除开NodeJs由npm管理以外，其他的css/js模块引入都由bower管理：

bower install jquery

4）安装Yoeman

npm install -g yo

5）安装compass

compass是对css打包的一个工具，用来编译scss。

这个东东需要ruby环境，一般可以用gem来安装。

gem update --system
gem install compass

如果gem不能在线安装，一个可能是国外的资源被墙了，要换taobao的源。

到目前为止，基本的环境已经配置安装好，下面解决如何运行脚手架架构项目工程。

比如我们要创建一个angularjs的项目：
1> mkdir yeoman-web
2> cd yeoman-web
3> sudo npm install -g generator-angular
4> yo webapp
5> npm install -g grunt && npm install -g grunt-cli
6> bower install && npm install（在你yeoman-web目录下安装js包）

PS［转载］http://www.tuicool.com/articles/IJbQFn

同样是前端脚手架，其实grunt已经满足了我们从项目创建到项目构建的需求，为什么要用yeoman？ 

简单来说就是yeoman比grunt好用。

1）基于bower的前端资源依赖管理：这个的重要性无需强调，请回忆一下我们满头大汗就为了找到某个js文件，或因缺少某个依赖的js文件导致脚本出错的经历。

2）子模板：相当有用的特性。你可以用它完成子项目创建、子模块创建、资源更新等工作，给项目提供了更多的灵活性。

3）基于问题的项目骨架构建：这点其实grunt-init也有，但yeoman明显做得更好，如二选一、单选列表、多选列表等。grunt-init 的问答流程内部实现则相对费解。

Yeoman项目下几个重要的文件

• Gruntfile.js：grunt任务声明的地方
• package.json：项目依赖的插件，比如grunt任务依赖的插件等
• bower.json：前端资源依赖声明