使用Yeoman搭建 AngularJS 应用 (1) —— 介绍
2016-04-19 15:34
507 查看
原文地址:http://yeoman.io/learning/
Yeoman 是一个通用的可以创建多种应用的基架系统。它帮助用户快速搭建新的项目,并且可以简化已存在项目的维护过程。
Yeoman是不限制语言的,它可以生成任何语言编写的项目(Web, Java, Python, C#, 等等)。
Yeoman自己不会做任何决策。每个决策都是Yeoman环境中的生成器 (generators) 做出的。这里有一个生成器的列表http://yeoman.io/generators/,用户也可以很简单的创建符合任何工作流的生成器http://yeoman.io/authoring/。Yeoman会为根据基架的需求提供正确的选择。
这里有一些通用的实例:
迅速的创建一个新的项目
创建项目中新的部分,比如一个新的单元测试控制器 (controller)
创建模块或者程序包
引导新的服务
强制执行标准,最佳实践和风格指南
优化新的项目,让用户创建一个简单的应用
等等
然后安装需要的生成器。生成器的 npm 程序包命名规则是 generator-XYZ。在http://yeoman.io/generators/可以查看生成器的种类,或者使用 yo运行 “install a generator” 菜单选项。安装webapp生成器:
新的Node和npm用户可能会陷入权限问题。这个问题会在安装时以EACCESS形式的错误显示出来。如果你碰到了这个问题,请参考https://docs.npmjs.com/getting-started/fixing-npm-permissions。
npm是Node.js程序包的管理器。
在Windows,我们建议使用一个更好的命令行工具,比如cmder或者PowerShell来提高用户体验。
用基架构建一个项目,运行:
大多数生成器会询问一系列的问题来自定义新的项目。运行 help 来看看那些选项可以设置。
大多数生成器依赖于构建系统 (像 Grunt 或者 Gulp) 和程序包管理器 (比如 npm 和 Bower)。访问生成器的网址,来学习有关运行和维护新的应用的知识。通过命令来简单的访问一个生成器的网页。
生成器的基架可能会提供额外的生成器来管理项目的更小的部分。这些生成器常常被称为附属生成器(sub-generators),并且使用 generator:sub-generator来存取。
使用 generator-angular 作为例子。一旦这个 angular 应用已经生成了,其他的特点也能被添加。可以使用下面的命令来添加新的控制器。
yo也提供以下命令。
获取全部的辅助屏幕
列出已经安装的生成器
获取版本
doctor 命令将会诊断问题并且提供解决问题的步骤
下一章会介绍如何使用Yeoman创建一个AngularJS的项目
Yeoman 是一个通用的可以创建多种应用的基架系统。它帮助用户快速搭建新的项目,并且可以简化已存在项目的维护过程。
Yeoman是不限制语言的,它可以生成任何语言编写的项目(Web, Java, Python, C#, 等等)。
Yeoman自己不会做任何决策。每个决策都是Yeoman环境中的生成器 (generators) 做出的。这里有一个生成器的列表http://yeoman.io/generators/,用户也可以很简单的创建符合任何工作流的生成器http://yeoman.io/authoring/。Yeoman会为根据基架的需求提供正确的选择。
这里有一些通用的实例:
迅速的创建一个新的项目
创建项目中新的部分,比如一个新的单元测试控制器 (controller)
创建模块或者程序包
引导新的服务
强制执行标准,最佳实践和风格指南
优化新的项目,让用户创建一个简单的应用
等等
入门指南
yo 是 Yeoman 命令行公用程序,允许利用基架模板创建项目 (被称为生成器),Yo和生成器的安装使用npm。安装yo和一些生成器
第一件事是使用 npm 来安装 yo:npm install -g yo
然后安装需要的生成器。生成器的 npm 程序包命名规则是 generator-XYZ。在http://yeoman.io/generators/可以查看生成器的种类,或者使用 yo运行 “install a generator” 菜单选项。安装webapp生成器:
npm install -g generator-webapp
新的Node和npm用户可能会陷入权限问题。这个问题会在安装时以EACCESS形式的错误显示出来。如果你碰到了这个问题,请参考https://docs.npmjs.com/getting-started/fixing-npm-permissions。
npm是Node.js程序包的管理器。
在Windows,我们建议使用一个更好的命令行工具,比如cmder或者PowerShell来提高用户体验。
基本的基架
我们将在下面的例子使用 generator-webapp,替代 webapp 来命名你的生成器。用基架构建一个项目,运行:
yo webapp
大多数生成器会询问一系列的问题来自定义新的项目。运行 help 来看看那些选项可以设置。
yo webapp --help
大多数生成器依赖于构建系统 (像 Grunt 或者 Gulp) 和程序包管理器 (比如 npm 和 Bower)。访问生成器的网址,来学习有关运行和维护新的应用的知识。通过命令来简单的访问一个生成器的网页。
npm home generator-webapp
生成器的基架可能会提供额外的生成器来管理项目的更小的部分。这些生成器常常被称为附属生成器(sub-generators),并且使用 generator:sub-generator来存取。
使用 generator-angular 作为例子。一旦这个 angular 应用已经生成了,其他的特点也能被添加。可以使用下面的命令来添加新的控制器。
yo angular:controller MyNewController
其他yo命令
除了之前的段落,yo也是一个完全的交互工具。简单的在终端输入yo将会提供选项的列表,来管理有关的生成器:运行,更新,安装,帮助和其他实用程序。yo也提供以下命令。
获取全部的辅助屏幕
yo --help
列出已经安装的生成器
yo --generators
获取版本
yo --version
异常处理
运行下面的命令可以看到大多数的问题yo doctor
doctor 命令将会诊断问题并且提供解决问题的步骤
下一章会介绍如何使用Yeoman创建一个AngularJS的项目
相关文章推荐
- angular 学习网址推荐(持续更新中)
- Angularjs 跨域post数据到springmvc
- ANgularjs练手篇——Server的调用
- Angularjs练手篇——Server编写
- AngularJS双向数据绑定
- angular学习(二)—— Data Binding
- [Angular 2] Child Router
- 基于Angularjs+jasmine+karma的测试驱动开发(TDD)实例
- Angularjs基础(三)
- 前端开发利器: Bootstrap + AngularJS
- angular学习(一)—— 概览
- angularjs 剪贴板
- Introduction to Angular 2 Forms - Template Driven vs Model Driven Forms
- angularjs和angular-cookies 设置cookie的过期时间
- AngularJS入门教程之AngularJS模型
- AngularJS入门教程之AngularJS指令
- AngularJS入门教程之AngularJS表达式
- angularjs 路由 不能嵌套问题
- 创建自己的AngularJS - 作用域和Digest(五)
- [置顶] 跟我学AngularJS:全局变量设置之value vs constant vs rootscope vs 服务