docs: add redirect and update updating-to-v11 to v12 (#41625)

PR Close #41625

.pullapprove.yml

@@ -1008,7 +1008,7 @@ groups:
           'aio/content/guide/migration-localize.md',
           'aio/content/guide/migration-module-with-providers.md',
           'aio/content/guide/static-query-migration.md',
-          'aio/content/guide/updating-to-version-11.md',
+          'aio/content/guide/updating-to-version-12.md',
           'aio/content/guide/ivy-compatibility.md',
           'aio/content/guide/ivy-compatibility-examples.md'
           ])

aio/content/guide/ivy-compatibility.md

@@ -10,7 +10,7 @@ That said, some applications will likely need to apply some manual updates.
 
 If you're seeing errors, first temporarily [turn off Ivy](guide/ivy#opting-out-of-angular-ivy) in your `tsconfig.json` and re-start your app.
 
-If you're still seeing the errors, they are not specific to Ivy. In this case, you may want to consult the [general update guide](guide/updating-to-version-11). If you've opted into any of the new, stricter type-checking settings, you may also want to check out the [template type-checking guide](guide/template-typecheck).
+If you're still seeing the errors, they are not specific to Ivy. In this case, you may want to consult the [general update guide](guide/updating-to-version-12). If you've opted into any of the new, stricter type-checking settings, you may also want to check out the [template type-checking guide](guide/template-typecheck).
 
 If the errors are gone, switch back to Ivy by removing the changes to the `tsconfig.json` and review the list of expected changes below.
 

aio/content/guide/updating-to-version-11.md

@@ -1,73 +0,0 @@
-# Updating Angular
-
-This guide contains information related to updating to the latest version of Angular.
-
-## Updating CLI Apps
-
-For step-by-step instructions on how to update to the latest Angular release (and leverage our automated migration tools to do so), use the interactive update guide at [update.angular.io](https://update.angular.io).
-
-## Changes and Deprecations in Version 11
-
-<div class="alert is-helpful">
-
-   For information about Angular's deprecation and removal practices, see [Angular Release Practices](guide/releases#deprecation-practices "Angular Release Practices: Deprecation practices").
-
-</div>
-
-{@a breaking-changes}
-### New Breaking Changes
-
-* Remove deprecated support for IE 9, 10, and IE mobile. See [PR 38931](https://github.com/angular/angular/pull/38931).
-* TypeScript 3.9 is no longer supported. Please update to TypeScript 4.0. See [PR 39313](https://github.com/angular/angular/pull/39313).
-* `NavigationExtras#preserveQueryParams` has been removed from `@angular/router`. See [PR 38762](https://github.com/angular/angular/pull/38762)
-* `CollectionChangeRecord` has been removed from `@angular/core`. See [PR 38668](https://github.com/angular/angular/pull/38668).
-* We changed the default value for `relativeLinkResolution` from `'legacy'` to `'corrected'` so that new applications are automatically opted-in to the corrected behavior from  [PR 22394](https://github.com/angular/angular/pull/22394). Applications which use the current default are updated by a migration to specify `'legacy'` to ensure the current behavior is maintained when the default is updated. See [PR 25609](https://github.com/angular/angular/pull/25609).
-* Fixed a bug in the router where the arguments for `future` and `curr` snapshots were reversed in the call to `shouldReuseRoute` when processing child routes. Usually this ordering mistake doesn't matter because most implementations of [`shouldReuseRoute`](api/router/RouteReuseStrategy#shouldReuseRoute) just do
-an equality comparison between `future` and `curr`. However, some implementations actually do rely on values specifically on
-one of the two and will need to be updated. See [PR 26949](https://github.com/angular/angular/pull/26949).
-* `ViewEncapsulation.Native` has been removed. Angular previously supported a view encapsulation mode `ViewEncapsulaion.Native` that was based on the v0 Shadow DOM Draft APIs. These APIs have been superceded by the final Shadow DOM APIs, which are enabled via `ViewEncapsulation.ShadowDom`. For background information about this change, see [Web Components update: more time to upgrade to v1 APIs](https://developers.google.com/web/updates/2019/07/web-components-time-to-upgrade).
-* `@angular/platform-webworker` has been removed and will no longer be supported. See [PR 38846](https://github.com/angular/angular/pull/38846).
-* `@angular/platform-webworker` is no longer supported. No further versions will be published. See [PR 38846](https://github.com/angular/angular/pull/38846).
-* Updated the options for `initialNavigation`. For more information, see [initialNavigation](api/router/InitialNavigation) in the API documentation. See [PR 33128](https://github.com/angular/angular/pull/33128).
-* `DatePipe` no longer rounds up fractional milliseconds. See [PR 38009](https://github.com/angular/angular/pull/38009).
-* Locale data arrays are now read-only. See [PR 30397](https://github.com/angular/angular/pull/30397).
-* The injected `ControlValueAccessor` for `NG_VALUE_ACCESSOR` is now readonly. See [PR 29273](https://github.com/angular/angular/pull/29723).
-* The type of `AbstractControl#parent` now indicates that it may be null. See [PR 32671](https://github.com/angular/angular/pull/32671).
-* Calling `overrideProvider` before initializing the TestBed will now throw an error. See [PR 38717](https://github.com/angular/angular/pull/38717).
-* Types for many Angular built-in pipes have been either narrowed or expanded to be more accurate. For more information, see the corresponding [Pipes](https://angular.io/api?type=pipe) API documentation. See [PR 37447](https://github.com/angular/angular/pull/37447).
-* Directives in the `@angular/forms` package used to have `any[]` as a type of validators and asyncValidators
-arguments in constructors. Now these arguments are properly typed, so if your code relies on
-directive constructor types it may require some updates to improve type safety. See [PR 38994](https://github.com/angular/angular/pull/38944).
-* `routerLink` now accepts `undefined` inputs. See [PR 39151](https://github.com/angular/angular/pull/39151).
-* The `async` function from `@angular/core/testing` has been renamed to `waitForAsync` in order to avoid confusion with the native JavaScript `async` syntax. The existing function is deprecated and will be removed in a future version. See [PR 37583](https://github.com/angular/angular/pull/37583).
-
-{@a deprecations}
-### New Deprecations
-
-| Area                          | API or Feature                                     | May be removed in |
-| ----------------------------- | -------------------------------------------------- | ----------------- |
-| `@angular/core/testing`       | Rename `async` to `waitForAsync`                       | <!--v11--> v13 |
-
-
-{@a removals}
-### New Removals of Deprecated APIs
-
-The following APIs have been removed starting with version 11.0.0*:
-
-| Package          | API            | Replacement | Notes |
-| ---------------- | -------------- | ----------- | ----- |
-| `@angular/router`| `NavigationExtras#preserveQueryParams` | no action needed | NavigationExtras#preserveQueryParams has been removed from `@angular/router`.|
-| `@angular/core` | `CollectionChangeRecord` | no action needed | CollectionChangeRecord has been removed from `@angular/core`.|
-| `@angular/core` | `ViewEncapsulation.Native` | no action needed | Angular previously supported a view encapsulation mode `ViewEncapsulaion.Native` that was based on the v0 Shadow DOM Draft APIs. These APIs have been superceeded by the final Shadow DOM APIs, which are enabled via `ViewEncapsulation.ShadowDom`. For background information about this change, see [Web Components update: more time to upgrade to v1 APIs](https://developers.google.com/web/updates/2019/07/web-components-time-to-upgrade).|
-
-{@a ivy}
-
-## Ivy features and compatibility
-
-Since version 9, Angular Ivy is the default rendering engine. If you haven't heard of Ivy, you can read more about it in the [Angular Ivy guide](guide/ivy).
-
-* Among other features, Ivy introduces more comprehensive type-checking within templates. For details, see [Template Type-checking](guide/template-typecheck).
-
-* For general guidance on debugging and a list of minor changes associated with Ivy, see the [Ivy compatibility guide](guide/ivy-compatibility).
-
-* For help with opting out of Ivy, see the instructions [here](guide/ivy#opting-out-of-angular-ivy).

aio/content/guide/updating-to-version-12.md

@@ -0,0 +1,104 @@
+# Updating Angular
+
+This guide contains information related to updating to Angular version 12.
+
+## Updating CLI applications
+
+For step-by-step instructions on how to update to the latest Angular release and leverage our automated migration tools to do so, use the interactive update guide at [update.angular.io](https://update.angular.io).
+
+
+## Building applications with Ivy
+
+For libraries, View Engine is deprecated and will be removed in version 13.
+New libraries created with version 12 or later default to Ivy.
+For more information about distributing libraries with View Engine and Ivy, see the [Building libraries with Ivy](guide/creating-libraries#ivy-libraries) section of [Creating libraries](guide/creating-libraries).
+
+## Changes and deprecations in version 12
+
+<div class="alert is-helpful">
+
+   For information about Angular's deprecation and removal practices, see [Angular Release Practices](guide/releases#deprecation-practices "Angular Release Practices: Deprecation practices").
+
+</div>
+
+* Applications can no longer build with View Engine by setting `enableIvy: false`.
+  Support for building libraries with View Engine, for backwards compatibility, is deprecated and will be removed in Angular version 13.
+  New libraries created with Angular version 12 will default to building and distributing with Ivy.
+  For more information, see [Creating Libraries](guide/creating-libraries).
+* The Ivy-based IDE [language service](guide/language-service) is now on by default.
+  See [PR #1279](https://github.com/angular/vscode-ng-language-service/pull/1279).
+* Angular's View Engine-based algorithm for generating i18n message IDs is deprecated.
+  Angular version 12 adds a new flag to `localize-extract` called `--migrateMapFile` which  generates a JSON file that can be used to map legacy message IDs to canonical ones.
+  There is also a new script called `localize-migrate` that can use the mapping file which `localize-extract` generates and migrate all of the IDs in the files that are passed in.
+  For better stability, if you are using Angular's `i18n`, run this migration to move to the new message ID generation algorithm.
+  If you don't run this migration, all your generated message IDs will change when Angular removes the View Engine compiler.
+  See [PR #41026](https://github.com/angular/angular/pull/41026).
+* There is now a new build option named `inlineStyleLanguage` for defining the style sheet language in inline component styles.
+  Currently supported language options are CSS (default), Sass, SCSS, and LESS.
+  The default of CSS enables existing projects to continue to function as expected.
+  See [PR #20514](https://github.com/angular/angular-cli/pull/20514).
+* For new applications, strict mode is now the default in the CLI.
+  See [PR #20029](https://github.com/angular/angular-cli/pull/20029).
+* Add `emitEvent` option for `AbstractControl` class methods.
+  See [PR #31031](https://github.com/angular/angular/pull/31031).
+* Support `APP_INITIALIZER` to work with observables.
+  See [PR #31031](https://github.com/angular/angular/pull/31031).
+* `HttpClient` supports specifying request metadata.
+  See [PR #25751](https://github.com/angular/angular/pull/25751).
+
+
+{@a breaking-changes}
+### Breaking changes in Angular version 12
+
+* Add support for TypeScript 4.2.
+  TypeScript <4.2.3 is no longer supported.
+  The supported range of TypeScript versions is 4.2.3 to 4.2.x.
+  See [PR #41158](https://github.com/angular/angular/pull/41158).
+* Angular CDK and Angular Material internally now use the new [Sass module system](https://sass-lang.com/blog/the-module-system-is-launched), which is actively maintained by the Sass team at Google.
+  Consequently, applications can no longer consume Angular CDK/Material's Sass with the [`node-sass` npm package](https://www.npmjs.com/package/node-sass).
+  `node-sass` is unmaintained and does not support newer Sass features. Instead, applications must use the [`sass` npm package](https://www.npmjs.com/package/sass), or the [`sass-embedded` npm package](https://www.npmjs.com/package/sass-embedded) for the `sass-embedded` beta.
+* The Angular tooling now uses Webpack 5 to build applications. Webpack 4 usage and support has been removed.
+  You don't need to make any project level configuration changes to use the upgraded Webpack version when using the official Angular builders.
+  Custom builders based on this package that use the experimental programmatic APIs may need to be updated to become compatible with Webpack 5.
+  See [PR #20466](https://github.com/angular/angular-cli/pull/20466).
+* Webpack 5 generates similar but differently named files for lazy-loaded JavaScript files in development configurations when the `namedChunks` option is enabled.
+  For the majority of users this change should have no effect on the application or build process.
+  Production builds should also not be affected as the `namedChunks` option is disabled by default in production configurations.
+  However, if a project's post-build process makes assumptions as to the file names, then adjustments may need to be made to account for the new naming paradigm.
+  Such post-build processes could include custom file transformations after the build, integration into service-side frameworks, or deployment procedures.
+  An example of a development file name change is `lazy-lazy-module.js` becoming `src_app_lazy_lazy_module_ts.js`.
+  See [PR #20466](https://github.com/angular/angular-cli/pull/20466).
+* Webpack 5 now includes web worker support.
+  However, the structure of the URL within the worker constructor must be in a specific format that differs from the current requirement.
+  To update web worker usage, where `./app.worker` is the actual worker name, change `new Worker('./app.worker', ...)` to `new Worker(new URL('./app.worker', import.meta.url), ...)`.
+  See [PR #20466](https://github.com/angular/angular-cli/pull/20466).
+* Critical CSS inlining is now enabled by default.
+  To turn this off, set `inlineCritical` to false.
+  See [PR #20096](https://github.com/angular/angular-cli/pull/20096) and the [Style preprocessor options](guide/workspace-config#optimization-configuration) section of [Angular workspace configuration](guide/workspace-config).
+* `ng build` now produces production bundle by default.
+  See [PR #20128](https://github.com/angular/angular-cli/pull/20128).
+* Previously, the Forms module ignored `min` and `max` attributes defined on the `<input type="number">`.
+  Now these attributes trigger `min` and `max` validation logic in cases where `formControl`, `formControlName`, or `ngModel` directives are also present on a given input.
+  See [PR #39063](https://github.com/angular/angular/pull/39063).
+
+
+{@a deprecations}
+### New deprecations
+
+* Support for Internet Explorer 11 is deprecated.
+  See [Deprecated APIs and features](guide/deprecations) and [Microsoft 365 apps say farewell to Internet Explorer 11 and Windows 10 sunsets Microsoft Edge Legacy](https://techcommunity.microsoft.com/t5/microsoft-365-blog/microsoft-365-apps-say-farewell-to-internet-explorer-11-and/ba-p/1591666).
+* Sass imports from `@angular/material/theming` are deprecated. There is a new Angular Material Sass API for `@use`.
+  Run the migration script `ng g @angular/material:themingApi` to switch all your Sass imports for Angular CDK and Angular Material to the new API and `@use`.
+* Support for publishing libraries with View Engine has been deprecated:
+  - You can now compile libraries in [_partial_ compilation mode](guide/angular-compiler-options#compilationmode) to generate Ivy compatible output that will be _linked_ when an application using that library is bundled.
+  - New libraries you create with the Angular CLI default to partial compilation mode, and do not support View Engine. You can still build a library with View Engine. See [Creating libraries](guide/creating-libraries) for more information.
+  - Libraries compiled in partial compilation mode will not contain legacy `i18n` message IDs.
+    If the library was previously compiled by View Engine, and contained legacy `i18n` message IDs, then applications may have translation files that you'll need to migrate to the new message ID format. For more information, see [Migrating legacy localization IDs](guide/migration-legacy-message-id).
+  - For context, see [Issue #38366](https://github.com/angular/angular/issues/38366).
+
+<div class="alert is-helpful">
+
+Since version 9, Angular Ivy is the default rendering engine.
+For more information about Ivy, see [Angular Ivy](guide/ivy).
+
+</div>

aio/content/navigation.json

@@ -651,13 +651,13 @@
           "tooltip": "Roadmap of the Angular team."
         },
         {
-          "title": "Updating to Version 11",
+          "title": "Updating to Version 12",
-          "tooltip": "Support for updating your application from version 9 to 10.",
+          "tooltip": "Support for updating your application from version 11 to 12.",
           "children": [
             {
-              "url": "guide/updating-to-version-11",
+              "url": "guide/updating-to-version-12",
               "title": "Overview",
-              "tooltip": "Everything you need to know for updating your application from version 10 to 11."
+              "tooltip": "Everything you need to know for updating your application from version 11 to 12."
             },
             {
               "url": "guide/ivy-compatibility",

aio/firebase.json

@@ -32,7 +32,8 @@
       {"type": 301, "source": "/getting-started", "destination": "/start"},
       {"type": 301, "source": "/getting-started/:rest*", "destination": "/start/:rest*"},
       {"type": 301, "source": "/guide/displaying-data", "destination": "/start#template-syntax"},
-      {"type": 301, "source": "/guide/updating-to-version-10", "destination": "/guide/updating-to-version-11"},
+      {"type": 301, "source": "/guide/updating-to-version-10", "destination": "https://v11.angular.io/guide/updating-to-version-11"},
+      {"type": 301, "source": "/guide/updating-to-version-11", "destination": "/guide/updating-to-version-12"},
 
       // Renaming of Getting Started topics
       {"type": 301, "source": "/start/data", "destination": "/start/start-data"},

aio/ngsw-config.json

@@ -127,6 +127,9 @@
     "!/guide/updating-to-version-10",
     "!/guide/updating-to-version-10.html",
     "!/guide/updating-to-version-10/",
+    "!/guide/updating-to-version-11",
+    "!/guide/updating-to-version-11.html",
+    "!/guide/updating-to-version-11/",
     "!/guide/webpack",
     "!/guide/webpack.html",
     "!/guide/webpack/",

aio/tests/deployment/shared/URLS_TO_REDIRECT.txt

@@ -185,7 +185,8 @@
 /guide/service-worker-getstart --> /guide/service-worker-getting-started
 /guide/service-worker-comm --> /guide/service-worker-communications
 /guide/service-worker-configref --> /guide/service-worker-config
-/guide/updating-to-version-10 --> /guide/updating-to-version-11
+/guide/updating-to-version-10 --> https://v11.angular.io/guide/updating-to-version-11
+/guide/updating-to-version-11 --> /guide/updating-to-version-12
 /guide/webpack --> https://v5.angular.io/guide/webpack
 /news --> https://blog.angular.io/
 /news.html --> https://blog.angular.io/