docs: change links to cli wiki to link to new aio docs (#26489)

PR Close #26489

aio/content/guide/aot-compiler.md

@@ -8,7 +8,7 @@ This guide explains how to specify metadata and apply available compiler options
 
 <div class="alert is-helpful"
 
-  <a href="https://www.youtube.com/watch?v=kW9cJsvcsGo">Watch compiler author Tobias Bosch explain the Angular Compiler</a> at AngularConnect 2016.
+  <a href="https://www.youtube.com/watch?v=kW9cJsvcsGo">Watch compiler author Tobias Bosch explain the Angular compiler</a> at AngularConnect 2016.
 
 </div>
 
@@ -21,7 +21,7 @@ Angular offers two ways to compile your application:
 1. **_Just-in-Time_ (JIT)**, which compiles your app in the browser at runtime.
 1. **_Ahead-of-Time_ (AOT)**, which compiles your app at build time.
 
-JIT compilation is the default when you run the _build-only_ or the _build-and-serve-locally_ CLI commands:
+JIT compilation is the default when you run the [`ng build`](cli/build) (build only) or [`ng serve`](cli/serve)  (build and serve locally) CLI commands: 
 
 <code-example language="sh" class="code-shell">
   ng build
@@ -30,7 +30,7 @@ JIT compilation is the default when you run the _build-only_ or the _build-and-s
 
 {@a compile}
 
-For AOT compilation, append the `--aot` flags to the _build-only_ or the _build-and-serve-locally_ CLI commands:
+For AOT compilation, include the `--aot` option with the `ng build` or `ng serve` command:
 
 <code-example language="sh" class="code-shell">
   ng build --aot
@@ -41,7 +41,7 @@ For AOT compilation, append the `--aot` flags to the _build-only_ or the _build-
 
 The `ng build` command with the `--prod` meta-flag (`ng build --prod`) compiles with AOT by default.
 
-See the [CLI documentation](https://github.com/angular/angular-cli/wiki) for details, especially the [`build` topic](https://github.com/angular/angular-cli/wiki/build).
+See the [CLI command reference](cli) and [Building and serving Angular apps](guide/build) for more information.
 
 </div>
 

aio/content/guide/architecture-services.md

@@ -82,7 +82,7 @@ or you can register providers with specific modules or components.
 You register providers in the metadata of the service (in the `@Injectable()` decorator),
 or in the `@NgModule()` or `@Component()` metadata 
 
-* By default, the Angular CLI command `ng generate service` registers a provider with the root injector for your service by including provider metadata in the `@Injectable()` decorator. The tutorial uses this method to register the provider of  HeroService class definition.
+* By default, the Angular CLI command [`ng generate service`](cli/generate) registers a provider with the root injector for your service by including provider metadata in the `@Injectable()` decorator. The tutorial uses this method to register the provider of  HeroService class definition.
 
    ``` 
    @Injectable({

aio/content/guide/attribute-directives.md

@@ -43,7 +43,7 @@ when the user hovers over that element. You can apply it like this:
 
 ### Write the directive code
 
-Create the directive class file in a terminal window with this CLI command.
+Create the directive class file in a terminal window with the CLI command [`ng generate directive`](cli/generate).
 
 <code-example language="sh" class="code-shell">
 ng generate directive highlight

aio/content/guide/bootstrapping.md

@@ -12,7 +12,7 @@ Every application has at least one Angular module, the _root_ module
 that you bootstrap to launch the application.
 By convention, it is usually called `AppModule`.
 
-If you use the CLI to generate an app, the default `AppModule` is as follows:
+If you use the [Angular CLI](cli) to generate an app, the default `AppModule` is as follows:
 
 ```typescript
 /* JavaScript imports */
@@ -52,7 +52,7 @@ The `@NgModule` decorator identifies `AppModule` as an `NgModule` class.
 * **_bootstrap_**—the _root_ component that Angular creates and inserts
 into the `index.html` host web page.
 
-The default CLI application only has one component, `AppComponent`, so it
+The default application created by the Angular CLI only has one component, `AppComponent`, so it
 is in both the `declarations` and the `bootstrap` arrays.
 
 {@a declarations}

aio/content/guide/browser-support.md

@@ -122,7 +122,7 @@ Note that polyfills cannot magically transform an old, slow browser into a moder
 
 ## Enabling polyfills
 
-[Angular CLI](https://github.com/angular/angular-cli/wiki) users enable polyfills through the `src/polyfills.ts` file that
+[Angular CLI](cli) users enable polyfills through the `src/polyfills.ts` file that
 the CLI created with your project.
 
 This file incorporates the mandatory and many of the optional polyfills as JavaScript `import` statements.

aio/content/guide/build.md

@@ -8,7 +8,7 @@
 
 You can define different named build configurations for your project, such as *stage* and *production*, with different defaults. 
 
-Each named build configuration can have defaults for any of the options that apply to the various build targets, such as `build`, `serve`, and `test`. The CLI `build`, `serve`, and `test` commands can then replace files with appropriate versions for your intended target environment.
+Each named build configuration can have defaults for any of the options that apply to the various build targets, such as `build`, `serve`, and `test`. The [Angular CLI](cli) `build`, `serve`, and `test` commands can then replace files with appropriate versions for your intended target environment.
 
 The following figure shows how a project has multiple build targets, which can be executed using the named configurations that you define.
 

aio/content/guide/component-styles.md

@@ -164,7 +164,7 @@ They are _not inherited_ by any components nested within the template nor by any
 
 </div>
 
-The CLI defines an empty `styles` array when you create the component with the `--inline-style` flag.
+The Angular CLI command [`ng generate component`](cli/generate) defines an empty `styles` array when you create the component with the `--inline-style` flag.
 
 <code-example language="sh" class="code-shell">
 ng generate component hero-app --inline-style
@@ -193,7 +193,7 @@ They are _not inherited_ by any components nested within the template nor by any
 
 </div>
 
-The CLI creates an empty styles file for you by default and references that file in the component's generated `styleUrls`.
+When you use the Angular CLI command [`ng generate component`](cli/generate) without the `--inline-style` flag, it creates an empty styles file for you and references that file in the component's generated `styleUrls`.
 
 <code-example language="sh" class="code-shell">
 ng generate component hero-app
@@ -216,7 +216,8 @@ You can also write `<link>` tags into the component's HTML template.
 
 <div class="alert is-critical">
 
-When building with the CLI, be sure to include the linked style file among the assets to be copied to the server as described in the [CLI documentation](https://github.com/angular/angular-cli/wiki/stories-asset-configuration).
+When building with the CLI, be sure to include the linked style file among the assets to be copied to the server as described in the [CLI wiki](https://github.com/angular/angular-cli/wiki/stories-asset-configuration).
+<!-- 2018-10-16: The link above is still the best source for this information. -->
 
 Once included, the CLI will include the stylesheet, whether the link tag's href URL is relative to the application root or the component file.
 
@@ -239,7 +240,9 @@ When building with the CLI, you must configure the `angular.json` to include _al
 
 Register **global** style files in the `styles` section which, by default, is pre-configured with the global `styles.css` file.
 
-See the [CLI documentation](https://github.com/angular/angular-cli/wiki/stories-global-styles) to learn more.
+See the [CLI wiki](https://github.com/angular/angular-cli/wiki/stories-global-styles) to learn more.
+<!-- 2018-10-16: The link above is still the best source for this information. -->
+
 
 ### Non-CSS style files
 
@@ -259,8 +262,10 @@ The CLI build process runs the pertinent CSS preprocessor.
 
 When generating a component file with `ng generate component`, the CLI emits an empty CSS styles file (`.css`) by default.
 You can configure the CLI to default to your preferred CSS preprocessor
-as explained in the [CLI documentation](https://github.com/angular/angular-cli/wiki/stories-css-preprocessors
+as explained in the [CLI wiki](https://github.com/angular/angular-cli/wiki/stories-css-preprocessors
 "CSS Preprocessor integration").
+<!-- 2018-10-16: The link above is still the best source for this information. -->
+
 
 <div class="alert is-important">
 

aio/content/guide/dependency-injection.md

@@ -68,7 +68,7 @@ See an example in the [DI Cookbook](guide/dependency-injection-in-action#forward
 
 ### Create an injectable service class
 
-The [**Angular CLI**](https://cli.angular.io/) can generate a new `HeroService` class in the `src/app/heroes` folder with this command.
+The [Angular CLI](cli) can generate a new `HeroService` class in the `src/app/heroes` folder with this command.
 
 <code-example language="sh" class="code-shell">
 ng generate service heroes/hero

aio/content/guide/deployment.md

@@ -34,7 +34,7 @@ Another simple way to deploy your Angular app is to use [GitHub Pages](https://h
 1. You need to [create a GitHub account](https://github.com/join) if you don't have one, and then [create a repository](https://help.github.com/articles/create-a-repo/) for your project. 
 Make a note of the user name and project name in GitHub.
 
-1. Build your project using Github project name, with the following CLI command:
+1. Build your project using Github project name, with the Angular CLI command [`ng build`](cli/build) and the options shown here:
    <code-example language="none" class="code-shell">
      ng build --prod --output-path docs --base-href <project_name>
     </code-example>
@@ -99,7 +99,7 @@ The list is by no means exhaustive, but should provide you with a good starting
 
 #### Development servers
 
-During development, the `ng serve` command lets you run your app in a local browser. 
+During development, the [`ng serve`](cli/serve) CLI command lets you run your app in a local browser. 
 The CLI recompiles the application each time you save a file, 
 and reloads the browser with the newly compiled application. 
 
@@ -253,8 +253,7 @@ The `--prod` _meta-flag_ engages the following optimization features.
 
 The remaining [copy deployment steps](#copy-files) are the same as before.
 
-See [Building and serving Angular apps](guide/build) 
+See [`ng build`](cli/build) for more about CLI build options and what they do.
-for more about CLI build options and what they do.
 
 {@a enable-prod-mode}
 
@@ -410,4 +409,4 @@ ng build --watch
 ```
 Like the `ng serve` command, this regenerates output files when source files change. 
 
-For complete details of the CLI commands and configuration options, see the [CLI command reference](cli).
+For complete details of the CLI commands, see the [CLI command reference](cli).

aio/content/guide/displaying-data.md

@@ -135,7 +135,7 @@ In either style, the template data bindings have the same access to the componen
 
 <div class="alert is-helpful">
   
-  By default, the Angular CLI generates components with a template file. You can override that with:
+  By default, the Angular CLI command [`ng generate component`](cli/generate) generates components with a template file. You can override that with:
 
   <code-example hideCopy language="sh" class="code-shell">
     ng generate component hero -it

aio/content/guide/elements.md

@@ -119,7 +119,7 @@ The recently-developed [custom elements](https://developer.mozilla.org/en-US/doc
 
 In browsers that support Custom Elements natively, the specification requires developers use ES2015 classes to define Custom Elements - developers can opt-in to this by setting the `target: "es2015"` property in their project's `tsconfig.json`. As Custom Element and ES2015 support may not be available in all browsers, developers can instead choose to use a polyfill to support older browsers and ES5 code.
 
-Use the [Angular CLI](https://cli.angular.io/) to automatically set up your project with the correct polyfill: `ng add @angular/elements --name=*your_project_name*`.
+Use the [Angular CLI](cli) to automatically set up your project with the correct polyfill: `ng add @angular/elements --name=*your_project_name*`.
 - For more information about polyfills, see [polyfill documentation](https://www.webcomponents.org/polyfills).
 
 - For more information about Angular browser support, see [Browser Support](guide/browser-support).

aio/content/guide/feature-modules.md

@@ -33,7 +33,7 @@ pipes that it shares.
 
 ## How to make a feature module
 
-Assuming you already have a CLI generated app, create a feature
+Assuming you already have an app that you created with the [Angular CLI](cli), create a feature
 module using the CLI by entering the following command in the
 root project directory. Replace `CustomerDashboard` with the
 name of your module. You can omit the "Module" suffix from the name because the CLI appends it:

aio/content/guide/forms.md

@@ -99,7 +99,7 @@ A model can be as simple as a "property bag" that holds facts about a thing of a
 That describes well the `Hero` class with its three required fields (`id`, `name`, `power`)
 and one optional field (`alterEgo`).
 
-Using the Angular CLI, generate a new class named `Hero`:
+Using the Angular CLI command [`ng generate class`](cli/generate), generate a new class named `Hero`:
 
 <code-example language="sh" class="code-shell">
 
@@ -132,7 +132,7 @@ An Angular form has two parts: an HTML-based _template_ and a component _class_
 to handle data and user interactions programmatically.
 Begin with the class because it states, in brief, what the hero editor can do.
 
-Using the Angular CLI, generate a new component named `HeroForm`:
+Using the Angular CLI command [`ng generate component`](cli/generate), generate a new component named `HeroForm`:
 
 <code-example language="sh" class="code-shell">
 

aio/content/guide/frequent-ngmodules.md

@@ -71,7 +71,7 @@ of some of the things they contain:
 
 When you use these Angular modules, import them in `AppModule`,
 or your feature module as appropriate, and list them in the `@NgModule`
-`imports` array. For example, in the basic app generated by the CLI,
+`imports` array. For example, in the basic app generated by the [Angular CLI](cli),
 `BrowserModule` is the first import at the top of the `AppModule`,
 `app.module.ts`.
 

aio/content/guide/glossary.md

@@ -130,10 +130,10 @@ A [decorator](guide/glossary#decorator) statement immediately before a field in
 
 ## command-line interface (CLI)
 
-The [Angular CLI](https://cli.angular.io/) is a command-line tool for managing the Angular development cycle. Use it to create the initial filesystem scaffolding for a [workspace](guide/glossary#workspace) or [project](guide/glossary#project), and to run [schematics](guide/glossary#schematic) that add and modify code for initial generic versions of various elements. The CLI supports all stages of the development cycle, including building, testing, bundling, and deployment.
+The [Angular CLI](cli) is a command-line tool for managing the Angular development cycle. Use it to create the initial filesystem scaffolding for a [workspace](guide/glossary#workspace) or [project](guide/glossary#project), and to run [schematics](guide/glossary#schematic) that add and modify code for initial generic versions of various elements. The CLI supports all stages of the development cycle, including building, testing, bundling, and deployment.
 
 * To begin using the CLI for a new project, see [Getting Started](guide/quickstart).
-* To learn more about the full capabilities of the CLI, see the [Angular CLI documentation](https://github.com/angular/angular-cli/wiki).
+* To learn more about the full capabilities of the CLI, see the [CLI command reference](cli).
 
 {@a component}
 
@@ -621,8 +621,7 @@ For more information, see [Routing and Navigation](guide/router).
 A scaffolding library that defines how to generate or transform a programming project by creating, modifying, refactoring, or moving files and code. 
 The Angular [CLI](guide/glossary#cli) uses schematics to generate and modify [Angular projects](guide/glossary#project) and parts of projects.
 
-* Angular provides a set of schematics for use with the CLI. 
+* Angular provides a set of schematics for use with the CLI. See the [Angular CLI command reference](cli). The [`ng add`](cli/add) command runs schematics as part of adding a library to your project. The [`ng generate`](cli/generate) command runs schematics to create apps, libraries, and Angular code constructs. 
-For details, see [Angular CLI documentation](https://github.com/angular/angular-cli/wiki).
 
 * Library developers can create schematics that enable the CLI to generate their published libraries.
 For more information, see [devkit documentation](https://www.npmjs.com/package/@angular-devkit/schematics). 
@@ -785,7 +784,7 @@ See [custom element](guide/glossary#custom-element).
 ## workspace
 
 In Angular, a folder that contains [projects](guide/glossary#project) (that is, apps and libraries).
-The [CLI](guide/glossary#cli) `new` command creates a workspace to contain projects. 
+The [CLI](guide/glossary#cli) `ng new` command creates a workspace to contain projects. 
 Commands that create or operate on apps and libraries (such as `add` and `generate`) must be executed from within a workspace folder. 
 
 {@a X}

aio/content/guide/hierarchical-dependency-injection.md

@@ -23,7 +23,7 @@ When you specify providers in the `@Injectable()` decorator of the service itsel
 
 * Learn more about [tree-shakable providers](guide/dependency-injection-providers#tree-shakable-providers).
 
-You're likely to inject `UserService` in many places throughout the app and will want to inject the same service instance every time. Providing `UserService` through the `root` injector is a good choice, and is the default that the CLI uses when you generate a service for your app.
+You're likely to inject `UserService` in many places throughout the app and will want to inject the same service instance every time. Providing `UserService` through the `root` injector is a good choice, and is the default that the [Angular CLI](cli) uses when you generate a service for your app.
 
 <div class="alert-is-helpful">
 <header>Platform injector</header>

aio/content/guide/i18n.md

@@ -19,7 +19,7 @@ Angular simplifies the following aspects of internationalization:
 * Handling plural forms of words.
 * Handling alternative text.
 
-For localization, you can use the [**Angular CLI**](https://cli.angular.io/) to generate most of the boilerplate necessary to create files for translators, and to publish your app in multiple languages. 
+For localization, you can use the [Angular CLI](cli) to generate most of the boilerplate necessary to create files for translators, and to publish your app in multiple languages. 
 After you have set up your app to use i18n, the CLI can help you with the following steps:
 * Extracting localizable text into a file that you can send out to be translated.
 * Building and serving the app for a given locale, using the translated text.
@@ -413,7 +413,7 @@ By default, the command creates a file named `messages.xlf` in your `src/` folde
 
 If you don't use the CLI, you have two options:
 * You can use the `ng-xi18n` tool directly from the `@angular/compiler-cli` package.
-For more information, see [i18n in the CLI documentation](https://github.com/angular/angular-cli/wiki/xi18n).
+For more information, see the [`ng xi18n` command documentation](cli/xi18n).
 * You can use the CLI Webpack plugin `AngularCompilerPlugin` from the `@ngtools/webpack` package.
 Set the parameters `i18nOutFile` and `i18nOutFormat` to trigger the extraction.
 For more information, see the [Angular Ahead-of-Time Webpack Plugin documentation](https://github.com/angular/angular-cli/tree/master/packages/%40ngtools/webpack).