5b04abd5c0
The missing-injectable migration has been updated to handle a breaking change that is unrelated to missing ´@Injectable` decorators. Though, the breaking change will be handled as part of this migration since we did not want to create another migration (with all the boilerplate etc.) The guide has been already updated to reflect the new pattern the migration handles, but we should also rename the title of the guide to something that also mentions the other pattern. Not renaming the guide URL since it is referenced in past releases and it's safer to keep the old URL. The important thing is to change the actual rendered title. PR Close #34125
109 lines
6.7 KiB
Markdown
109 lines
6.7 KiB
Markdown
# Updating to Angular Version 9
|
|
|
|
This guide contains everything you need to know about updating to the next Angular version.
|
|
|
|
<div class="alert is-helpful">
|
|
|
|
For step-by-step instructions on how to update to the latest Angular release, use the interactive update guide at [update.angular.io](https://update.angular.io).
|
|
|
|
</div>
|
|
|
|
## Updating CLI Apps
|
|
|
|
If your application uses the CLI, you can update to version 9 automatically with the help of the `ng update` script:
|
|
|
|
```sh
|
|
ng update @angular/core@8 @angular/cli@8
|
|
git add .
|
|
git commit --all -m "build: update Angular packages to latest 8.x version"
|
|
ng update @angular/cli @angular/core --next
|
|
```
|
|
|
|
<div class="alert is-important">
|
|
In order to improve the updating experience, we strongly suggest that you update to the latest 8.x version of `@angular/core` and `@angular/cli`.
|
|
|
|
Additionally, during the RC period, the `--next` command line flag is required. This flag will no longer be necessary once version 9 final is released.
|
|
</div>
|
|
|
|
The script runs a series of small migrations that will transform the code of your application to be compatible with version 9.
|
|
If you're curious about the specific migrations being run, see the [automated migrations section](#migrations) for details on what code is changing and why.
|
|
|
|
## Changes and Deprecations in Version 9
|
|
|
|
<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
|
|
|
|
- Angular now compiles with Ivy by default. See [Ivy compatibility section](#ivy).
|
|
|
|
- CLI apps compile in [AOT mode](/guide/aot-compiler) by default (which includes template type-checking).
|
|
Users who only built with JIT before may see new type errors.
|
|
See our [template type-checking guide](guide/template-typecheck) for more information and debugging tips.
|
|
|
|
- Typescript 3.4 and 3.5 are no longer supported. Please update to Typescript 3.6.
|
|
|
|
- `tslib` is now listed as a peer dependency rather than a direct dependency. If you are not using the CLI, you must manually install `tslib`, using `yarn add tslib` or `npm install tslib --save`.
|
|
|
|
{@a deprecations}
|
|
### New Deprecations
|
|
|
|
| API | Replacement | Notes |
|
|
| ------------------------------------------------------------------------| ------------------------------------ | ----- |
|
|
| [`entryComponents`](api/core/NgModule#entryComponents) | none | See [`entryComponents`](guide/deprecations#entryComponents) |
|
|
| [`ANALYZE_FOR_ENTRY_COMPONENTS`](api/core/ANALYZE_FOR_ENTRY_COMPONENTS) | none | See [`ANALYZE_FOR_ENTRY_COMPONENTS`](guide/deprecations#entryComponents) |
|
|
| `ModuleWithProviders` without a generic | `ModuleWithProviders` with a generic | See [`ModuleWithProviders` section](guide/deprecations#moduleWithProviders) |
|
|
| `esm5` and `fesm5` distribution in `@angular/*` npm packages | `esm2015` and `fesm2015` entrypoints | See [`esm5` and `fesm5`](guide/deprecations#esm5-fesm5) |
|
|
| [`TestBed.get`](api/core/testing/TestBed#get) | [`TestBed.inject`](api/core/testing/TestBed#inject) | Same behavior, but type safe. |
|
|
|
|
|
|
{@a removals}
|
|
### New Removals of Deprecated APIs
|
|
|
|
| Package | API | Replacement | Notes |
|
|
| ------- | -------------- | ----------- | ----- |
|
|
| `@angular/core` | [`Renderer`](https://v8.angular.io/api/core/Renderer) | [`Renderer2`](api/core/Renderer2) | [Migration guide.](guide/migration-renderer) |
|
|
| `@angular/core` | [`RootRenderer`](https://v8.angular.io/api/core/RootRenderer) | [`RendererFactory2`](api/core/RendererFactory2) | none |
|
|
| `@angular/core` | [`RenderComponentType`](https://v8.angular.io/api/core/RenderComponentType) | [`RendererType2`](api/core/RendererType2) | none |
|
|
| `@angular/core` | [`WtfScopeFn`](https://v8.angular.io/api/core/WtfScopeFn) | none | v8 | See [Web Tracing Framework](#wtf) |
|
|
| `@angular/core` | [`wtfCreateScope`](https://v8.angular.io/api/core/wtfCreateScope) | none | v8 | See [Web Tracing Framework](guide/deprecations#wtf) |
|
|
| `@angular/core` | [`wtfStartTimeRange`](https://v8.angular.io/api/core/wtfStartTimeRange) | none | v8 | See [Web Tracing Framework](guide/deprecations#wtf) |
|
|
| `@angular/core` | [`wtfEndTimeRange`](https://v8.angular.io/api/core/wtfEndTimeRange) | none | v8 | See [Web Tracing Framework](guide/deprecations#wtf) |
|
|
| `@angular/core` | [`wtfLeave`](https://v8.angular.io/api/core/wtfLeave) | none | v8 | See [Web Tracing Framework](guide/deprecations#wtf) |
|
|
| `@angular/common` | `DeprecatedI18NPipesModule` | [`CommonModule`](api/common/CommonModule#pipes) | none |
|
|
| `@angular/common` | `DeprecatedCurrencyPipe` | [`CurrencyPipe`](api/common/CurrencyPipe) | none |
|
|
| `@angular/common` | `DeprecatedDatePipe` | [`DatePipe`](api/common/DatePipe) | none |
|
|
| `@angular/common` | `DeprecatedDecimalPipe` | [`DecimalPipe`](api/common/DecimalPipe) | none |
|
|
| `@angular/common` | `DeprecatedPercentPipe` | [`PercentPipe`](api/common/PercentPipe) | none |
|
|
| `@angular/forms` | [`NgFormSelectorWarning`](https://v8.angular.io/api/forms/NgFormSelectorWarning) | none |
|
|
| `@angular/forms` | `ngForm` element selector | `ng-form` element selector | none |
|
|
| `@angular/service-worker` | `versionedFiles` | `files` | In the service worker configuration file `ngsw-config.json`, replace `versionedFiles` with `files`. See [Service Worker Configuration](guide/service-worker-config#assetgroups). |
|
|
|
|
{@a ivy}
|
|
|
|
## Ivy features and compatibility
|
|
|
|
In 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).
|
|
|
|
{@a migrations}
|
|
## Automated Migrations for Version 9
|
|
|
|
Read about the migrations the CLI handles for you automatically:
|
|
|
|
- [Migrating from `Renderer` to `Renderer2`](guide/migration-renderer)
|
|
- [Migrating undecorated classes](guide/migration-undecorated-classes)
|
|
- [Migrating missing `@Injectable()` decorators and incomplete provider definitions](guide/migration-injectable)
|
|
- [Migrating dynamic queries](guide/migration-dynamic-flag)
|
|
- [Migrating to the new `$localize` i18n support](guide/migration-localize)
|
|
- [Migrating `ModuleWithProviders`](guide/migration-module-with-providers)
|