Util Yeoman

安装yeoman

1.获取yeoman安装提示:
curl -L get.yeoman.io | bash

This is no longer the preferred method to install yeoman.

To install yeoman, please run the following:
              `npm install -g yo grunt-cli bower`

You can find more at http://yeoman.io 

2.安装yeoman:
sudo npm install -g yo grunt-cli bower //方式1
or
sudo npm install -g yo //方式2
3.检查是否安装成功:
yo --version && bower --version && grunt --version
执行以上命令,将会输出四个版本信息,分别为Yeoman,Bower,Grunt,Grunt CLI(Grunt的命令行界面)版本信息。

1.5.0
1.6.5
grunt-cli v0.1.13
grunt v0.4.5

4.安装生成器:
yo

? What would you like to do? (Use arrow keys)
  Install a generator
  Find some help
  Get me out of here!

如果已安装提示:

? 'Allo user! What would you like to do? (Use arrow keys)
  Run a generator
❯ Webapp 
  ──────────────
  Update your generators 
  Install a generator 
  Find some help 
  Get me out of here! 
  ──────────────

5.用键盘的上下键来操作菜单,当选项’Install a generator’被高亮的时候按下回车键。 接下来我们需要寻找一个合适的生成器。搜索’angular’的话,你会得到很多搜索结果。这些生成器都是由许多Yeoman开源社区贡献的。在这个例子里,我们使用的是’generator-angular’。当选中了’generator-angular’后,按下回车执行安装,它所依赖的Node包就会开始被下载了。

? 'Allo user! What would you like to do? Install a generator
? Search npm for generators: angular
? Here's what I found. Official generator → ෴
  Install one? (Use arrow keys)
❯ angular ෴  Yeoman generator for AngularJS 
  a3 ACUBED Main Generator : JohnPapa AngularJS Style Guide + Yeoman generator for creating MEAN stack applications, using MongoDB, Express, AngularJS, and Node with generator-angular-fullstack v2.0.13 
  abk-angular yeoman generator for new angular modules 
  adf-widget Yeoman generator for angular-dashboard-framework widgets 
  admin Yeoman generator to add CRUD functionality to an angular site 
  aet-angular Generator for aet angular applications 
  aimerm Yeoman generator for creating MEAN stack applications, using MongoDB, Express, AngularJS, and Node and modified generator-angular-fullstack 
(Move up and down to reveal more choices)

当然如果你知道要安装的生成器的名字,你可以直接用npm来安装:
sudo npm install -g generator-angular

到此,angularjs的生成器已安装完毕。

使用生成器搭建应用

1.你可以在Yeoman的菜单中操作已经安装好的生成器:yo。当然你也可以直接创建一个新的项目目录,运行yo angular, 生成器会在这个目录下生成出你的项目文件的。
2.选择公共开发类库和需要的angular模块

Out of the box I include Bootstrap and some AngularJS recommended modules.

? Would you like to use Gulp (experimental) instead of Grunt? No
? Would you like to use Sass (with Compass)? No
? Would you like to include Bootstrap? Yes

按下回车键,Yeoman将会自动构建你的应用、拉取需要的依赖并在你的工作流中创建一些有帮助的Grunt任务(Grunt Tasks)。

? Which modules would you like to include? angular-animate.js, angular-cookies.js, angular-resource.js, angular-route.js, angular-sanitize.js, angular-touch.j   create app/styles/main.css
   create app/index.html
   create bower.json
   create .bowerrc
   create package.json
   create Gruntfile.js
   create README.md
   invoke   angular:common:/usr/local/lib/node_modules/generator-angular/app/index.js
   create     .editorconfig
   create     .gitattributes
   create     .jscsrc
   create     .jshintrc
   create     .yo-rc.json
   create     .gitignore
   create     test/.jshintrc
   create     app/404.html
   create     app/favicon.ico
   create     app/robots.txt
   create     app/views/main.html
   create     app/images/yeoman.png
   invoke   angular:main:/usr/local/lib/node_modules/generator-angular/app/index.js
   create     app/scripts/app.js
   invoke   angular:controller:/usr/local/lib/node_modules/generator-angular/app/index.js
   create     app/scripts/controllers/main.js
   create     test/spec/controllers/main.js
   invoke   karma:app


I'm all done. Running bower install & npm install for you to install the required dependencies. If this fails, try running the command yourself.


   invoke       angular:route
   invoke           angular:controller:/usr/local/lib/node_modules/generator-angular/route/index.js
   create             app/scripts/controllers/about.js
   create             test/spec/controllers/about.js
   invoke           angular:view:/usr/local/lib/node_modules/generator-angular/route/index.js
   create             app/views/about.html
   create     test/karma.conf.js
   ......

参考链接: 官网 & 借眼观世界

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值