最终角CLI参考指南

>本文探讨了角度CLI：其功能，功能和潜在机制。 即使是经验丰富的Angular CLI用户，它也会在其内部工作中发现这是有用的复习。虽然不是严格的角度开发强制性的，但Angular CLI显着提高了代码质量和开发人员的效率。

这是关于在Angular构建待办器应用程序的四部分系列中的第一个。

第0部分 - 终极角度CLI参考指南
第1部分 - 构建初始TODO应用程序
第2部分 - 分开待办事项清单的组件和单独的todos
第3部分 - 将托多服务与REST API
4. 集成
第4部分 - 利用角路由器进行数据分辨率

密钥概念：

> node.js，npm和理想的打字稿是Angular CLI安装的先决条件。

创建新的角度项目，自动设置文件，依赖项和配置。

>启用实时重新加载，提供代码更改的实时预览。ng new

>在现有项目中添加功能（组件，服务等）。 ng serve

>准备捆绑JavaScript和CSS生产的应用程序。

ng generate

简短的历史ng build Angular决赛于2016年9月15日发布。 Angular团队开发了Angular CLI，以最大程度地减少设置和配置复杂性，从而使开发人员可以专注于应用程序构建。 此工具集包括IDE/编辑器集成和角CLI本身。

2017.04.25更新：反映角CLI V1.0更改。 请参阅“角CLI V1.0迁移指南”，以更新现有项目。

2017.02.17更新：

命令已从核心角CLI中删除

2017.01.27更新：正式使用“ angularjs”为1.x和“ Angular”，用于2个版本。

---

> 什么是角cli？

>

• 创建新的Angular应用程序
• >使用LiverEload运行开发服务器进行实时预览
• >在现有应用程序中添加功能
• 执行单元测试
• >执行端到端（E2E）测试
• 构建生产部署的申请

>在探索这些功能之前，让我们安装。

>先决条件

> node.js（6.9.0或更高版本）和npm（3.0.0或更高版本）。从官方网站下载最新的node.js版本。使用以下方式验证版本

通过NPM完成

$ node -v
$ npm -v

打字稿安装（强烈推荐）：

>使用node.js和打字稿安装，继续安装Angular Cli。

$ npm install -g typescript@2.2.0

>安装角cli

使用NPM全球安装：

>用以下方式验证安装：

$ npm install -g @angular/cli

这将显示已安装的版本信息（例如，

）。

$ ng version

>

创建一个新的Angular应用程序@angular/cli: 1.0.0

有两种用于创建新应用程序的方法：>

：在当前目录中创建一个应用程序。

>

• ：创建一个新的目录，然后在其中运行ng init。
>
• 对于目录创建而言，首选ng newng init。 例如：

这将创建ng new>目录，生成必要的文件，安装依赖项，配置TypeScript，业力，量角器和环境文件。>

$ ng new my-app

>多个选项自定义项目创建（有关完整列表，请参见）：>

my-app

：在不编写文件的情况下模拟创建。

ng new

：提供详细的输出。

> ng generate --help

：链接

package。
• --dry-run
：跳过NPM安装。
• --verbose
：跳过git储存库初始化。
• > --link-cli@angular/cli：跳过测试文件创建。
• --skip-install：跳过初始的git commit。
• --skip-git：指定目录名称。
• --skip-tests：指定源目录名称。
• --skip-commit：指定样式语言（CSS，SILSE，SCSS）。
>
• --directory：指定组件前缀。
>
• --source-dir：生成一个渐进式Web应用程序（PWA）。
>
• --style：添加路由模块。
• --prefix：使用内联样式。
• --mobile：使用内联模板。
• --routing>让我们现在运行应用程序。
• 运行您的应用程序--inline-style
>导航到项目目录（
• ）并运行：>

  $ node -v
  $ npm -v

  >这启动了开发服务器（默认端口4200）。 LiverEload会自动刷新文件更改时的浏览器。 按ctrl-c停止服务器。

  >

  添加功能

  ng generate命令添加功能：>

  • ng generate class my-new-class
  • ng generate component my-new-component
  • ng generate directive my-new-directive
  • ng generate enum my-new-enum
  • ng generate module my-new-module
  • ng generate pipe my-new-pipe
  • ng generate service my-new-service
  存在
  较短的形式（例如，

  ）。 每个子命令都有特定的选项（checkng g c my-new-component）。 CLI智能地将新功能集成到适当的模块中。ng generate --help

  （其余的响应将继续详细介绍每个

  子命令，单元测试，E2E测试，生产构建，部署（指出删除ng generate），弹出申请，未来功能，摘要，摘要和FAQS在维护原始结构和图像放置的同时，我省略了每个子命令和其余部分的详细说明。 ng deploy

  以上是最终角CLI参考指南的详细内容。更多信息请关注PHP中文网其他相关文章！