angular-cli 文档

Angular/angular-cli

原文来自：https://github.com/angular/angular-cli

Angular/angular-cli

原文来自：https://github.com/angular/angular-cli

cli应用于基于ember-cli项目的Angular应用

备注:

如果你正从测试版或rc版本更新，请查看我们的1.0更新指南。

如果你希望合作，请查阅我们的合作事项清单。

在提交新问题之前，请注意查看那些被标注’常见问题清单’的问题，或许你可以找到你想要的问题答案。

前提说明：

cli和生成的项目存在依赖关系，要求node的版本在6.9.0+，npm 3.0+。

目录：

#安装

#用法

#生成一个新项目

#生成控制器、指令、管道和服务

#更新angular-cli

#基于angular-cli的开发说明

#文档

#证书

安装：

在你安装之前：请阅读前提说明

npm install -g @angular/cli

用法：

ng help

通过开发服务器生成一个angular项目

ng new PROJECT-NAME

cd PROJECT-NAME

ng serve

打开本地地址http://localhost:4200/。当你修改任意资源文件时，页面将自动重载。

你也可以通过开发服务器运行以下的命令行进行自己配置http host以及端口号：

ng serve —host 0.0.0.0 —port 4201

生成控制器、指令、管道和服务

你可以使用命令行 ng generate(或简写：ng g)，生成angular的控制器

Ng generate component my-new-component

Ng g component my-new-component  # 简写

# 控制器支持用相对路径生成

# 如果在src/app/feature，可以运行以下命令行生成

Ng g component new-cmp

# 你所要生成的控制器将出现在目录 src/app/feature/new-cmp 下

# 但是如果你运行以下命令行

ng g component  ../newer-cmp

# 你的控制器将会生成在上级目录，即：src/app/newer-cmp

# 如果你的当前目录是 src/app 你可以运行：

ng g component feature/new-cmp

# 控制器将会生成在 src/app/feature/new-cmp 路径下

你可以在以下的表格中找到所有可能需要的ng命令

Scaffold	Usage
Component	ng g component my-new-component
Directive	ng g directive my-new-directive
Pipe	ng g pipe my-new-pipe
Service	ng g service my-new-service
Class	ng g class my-new-class
Guard	ng g guard my-new-guard
Interface	ng g interface my-new-interface
Enum	ng g enum my-new-enum
Module	ng g module my-module

Angular-cli会在app.module.ts中给控制器、指令及管道自动添加引用，如果你需要给另外的自定义模块添加引用，按照以下步骤：

1、ng g module new-module

2、call ng g component new-module/new-component

上面的命令将会根据你新创建的模块增加新的控制器、指令或者管道。

更新angular—cli

如果你正在使用angular-cli 1.0.0-beta.28 或者更低版本，你需要先卸载angular-cli安装包

npm uninstall -g angular-cli

npm uninstall —save-dev angular-cli

为了更新angular cli到新版本，你必须更新全局的安装包和你项目本地的安装包

全局安装包：

npm uninstall -g @angular/cli

npm cache clean

# 如果npm版本高于version5，需要使用’npm cache verify’ 来避免报错（或者避免使用 —-force）

npm install -g @angular/cli@latest

本地项目安装包：

rm -rf node_modules dist # 在window的命令控制符中使用 rmdir /S/Q node_modules dist，在Windows PowerShell中使用rm -f -fo node_modules,dist

npm install —-save-dev @angular/cli@latest

npm install

如果你正从beta或者RC版本更新到1.0，请查阅我们的1.0更新指南文档。

在github的版本标签上，你会发现更多关于版本间改变的详细内容。

关于在Angular Cli上进行开发的一些规范

1、使用master分支

git clone https://github.com/angular/angular-cli.git

cd angular-cli

npm link

npm link 命令的作用和npm install -g是一样的，只是link不会从repo下载安装包，仅将克隆的angular-cli/ 文件目录变成全局的安装包。此外，这个目录的仓库会生成几个安装包，我们会使用特别的逻辑将所有的安装包添加到开发设置上。

任何在angular-cli目录文件上的改动都会立即影响到全局的@angular／cli安装包，你可以快速检测到你在cli项目上的任何改动。

现在可以通过以下命令行使用@angular/cli：

ng new foo

cd foo

npm link @angular/cli

ng serve

npm link @angular/cli将全局的@angular/cli包链到本地作用域。

也可以直接用 ng new foo —link-cli 自动级联到@angular/cli包。

可阅读官方的npm-link文档和npm-link cheatsheet获取更多信息。

想运行测试套件，可以使用node的tests/run_e2e.js命令。

接收一个文件名才能运行该命令（如：node tests/run_e2e.js tests/e2e/tests/build/dev-build.ts）

作为测试程序的部分，所有的的包都要构建和链接。在测试完成后，需要重新运行npm link来重新链接开发环境的AAngular CLI。