最近，在理解angular.json这个项目文件时，发现网上还没有类似资料，搜索了一些外文资料，在这里翻译总结下。

Angular CLI 6的发布，对之前进行了很多优化。在这篇文章中，我们将来理解Angular工作控件的概念和详细说明新的angular.json文件

自从Angular CLI v6-RC2发布之后,Angular CLI创建的项目架构已经发生变化。你可能已经注意到其中的变化，原有的 .angular-cli.json 已经被 angular.json 取代。

让我们来展示一些变化的地方来理解做了哪些优化：

什么是Angular工作空间

当我们使用Angular CLI来生成项目的时候，我们很有可能会看到angular-cli.json这个文件。

众所周知，这个文件是整个项目的概要，包含了 不同的环境，测试、代理、第三方资源 和 众多内置工具。

我们会遇到在一个单独的文件目录中，来管理多应用程序，尽管可行，却并不理想。我们并不能方便地共享和复用公共的代码，除此之外，没有npm scripts的协助，也不能为每一个应用配置build过程。

现在通过Angular CLI6，前述两种情况都可以实现！?

现在我们来定义一个新的术语：

Angular 工作空间 指的是 一个 由Angular CLI创建，并且能够包含多个项目 或者 由单一文件导出配置的库 的目录空间。

实际上，从现在开始，Angular CLI项目开始叫做 Angular 工作空间。

仅仅改变一个名字是没有意义的，最重要的一步在于 重构 CLI的内核，它现在被切分成几部分，在Schematics的顶部。

在这样一个根工作空间中，出现一个叫做 angular.json的配置文件（而不再是angular-cli.json）。

现在我们即将做的就是浏览一下这个概要，并且一步一步理解它。

浏览工作空间文件

我们工作ng new angular-cli-workspace-example来创建一个简单的工作空间。

以下是我们初始化的配置文件

{"$schema": "./node_modules/@angular/cli/lib/config/schema.json","version": 1,"newProjectRoot": "projects","projects": {"angular-cli-workspace-example": {"root": "","sourceRoot": "src","projectType": "application","prefix": "app","schematics": {},"architect": {"build": {},"serve": {},"extract-i18n": {},"test": {},"lint": {}}},"angular-cli-workspace-example-e2e": {"root": "e2e/","projectType": "application","architect": {"e2e": {},"lint": {}}}},"defaultProject": "angular-cli-workspace-example"
}

为了简化案例，上述中的内容被简化过。schematics和cli属性默认没有加上，但是我们还是会讲解。

是时候开始这个概要了！?️

$schema

JSON Schema 是一个允许我们注解和验证JSON数据格式的工具。Angular CLI使用它来强化对于Angular Workspace schema的解释说明。

上述演示了JSON Schema自动填充和验证的功能

`$schema`属性 关联了JSON Schema在Angular CLI中的实施文件。

version

`version`属性 指明了Angular 工作空间 概要的版本。

schematics

大家或多或少，都听说过 Schematics。作为Angular DevKit的一部分，用来转换、创建 或者 更新项目开发的工作流工具。

`schematics`属性 可以在工作空间的root level来配置Schematics packages的选项。

假设我们要 保证 每一个组件用不同的默认设置 来创建。例如，使用默认 使用 OnPush作为检测策略，通过声明模块和导出组件。

"schematics": {"@schematics/angular:component": {"changeDetection": "OnPush","export": true}
}

注意 这个会在工作空间的任何 level 进行应用。

cli

cli属性定义Angular CLI的配置。

以下是具体的配置属性：

packageManager

这个属性定义了Angular CLI使用的包管理工具，开执行命令，比如 `npm`,`yarn`.

newProjectRoot

这个属性定义了由CLI创建的新的内部应用和库放置的位置。默认值为`projects`

projects

这个属性包含了工作空间中所有项目的配置信息。

通常，在主项目之外还有另外一个项目-e2e测试的项目。

{"projects": {"angular-cli-workspace-example": {"root": "","sourceRoot": "src","projectType": "application","prefix": "app","schematics": {},"architect": {}},"angular-cli-workspace-example-e2e": {"root": "e2e/","projectType": "application","architect": {}}}
}

事实上，每当通过Angular CLI创建内部应用的时候，都会有e2e项目被初始化。

每一个项目的配置信息在下列属性中：

root

`root`属性 指定了项目文件的根文件夹，可能为空，但是它指定了一个特定的文件夹。

sourceRoot

`sourceRoot`指定了项目源文件位置

projectType

`projectType`属性表明了 项目的状态 是 `appliaction`还是`library`。

prefix

`prefix`属性  当CLI创建 `component`或者`directive`时，使用该属性 来区别他们。

schematics

`schematics`属性配置 `Schematics packages`

architect

任何项目都可以自定义 自动化命令，如 打包、serve、test、lint等等。这些都是基于prebuilt builders ，叫做Architect Targets。

"angular-cli-workspace-example": {"root": "","sourceRoot": "src","projectType": "application","prefix": "app","schematics": {},"architect": {"build": {"builder": "@angular-devkit/build-angular:browser","options": {},"configurations": {}},"serve": {"builder": "@angular-devkit/build-angular:dev-server","options": {},"configurations": {}},"extract-i18n": {"builder": "@angular-devkit/build-angular:extract-i18n","options": {}},"test": {"builder": "@angular-devkit/build-angular:karma","options": {}},"lint": {"builder": "@angular-devkit/build-angular:tslint","options": {}}}
}

defaultProject

`defaultProject`属性 当使用CLI命令时，`defaultProject`代表显示的名字。

以上就是本人做的一个简单总结，如若有不对的地方，请留言，谢谢！