Angular 9: end of life and how to upgrade

Angular 9 made Ivy the default compiler and runtime. It has been unsupported since August 2021, and an app still on v9 is thirteen majors behind the current release.

Release and support dates

Angular 9 was released in February 2020. Active support ended in August 2020 and long-term support ended in August 2021. Since then it receives no fixes of any kind, including security patches. The table for every major is in Angular version support and end of life.

What Angular 9 introduced

• Ivy by default. All applications moved to the Ivy compiler and runtime.
• AOT in development. ng serve started using ahead-of-time compilation, so development builds get the same compile-time checks as production builds.
• No more entryComponents. Ivy discovers dynamically created components on its own.
• Stricter template type checking through the fullTemplateTypeCheck and strictTemplates flags.
• A defined precedence for style and class bindings, plus binding to CSS custom properties.
• @angular/localize as the new i18n package.
• Component test harnesses in the CDK and Angular Material.
• TypeScript 3.6 and 3.7 support, and the providedIn: 'platform' and providedIn: 'any' options for services.

What needs attention when you upgrade

From 9 to 10:

• TypeScript 3.9, tslib 2 and TSLint 6 are required. ng update migrates them.
• Classes that use Angular features without an Angular decorator are no longer supported. A migration adds the decorators.
• Apps that use i18n must add @angular/localize with ng add @angular/localize.
• TestBed.get should become TestBed.inject.
• A resolver that returns EMPTY now cancels the navigation.
• The package format drops the esm5 and fesm5 bundles, which matters if you build without the CLI.

From 10 to 11:

• TypeScript 4.0 is required.
• Support for IE9, IE10 and IE Mobile is removed.
• Router: relativeLinkResolution defaults to corrected, preserveQueryParams is removed and the old initialNavigation values are removed.
• ViewEncapsulation.Native is removed. Use ViewEncapsulation.ShadowDom.
• Several pipes get stricter types. uppercase and lowercase throw on invalid input.
• TSLint and Codelyzer are deprecated, so plan the move to ESLint.

A short upgrade approach

1. Update to the latest 9.1.x patch, confirm that the build and the tests pass, and commit.
2. Check Node.js. Angular 9, 10 and 11 run on Node 10.13 or 12.11 and later. Angular 12 no longer runs on Node 10.
3. Run npx @angular/cli@10 update @angular/core@10 @angular/cli@10, then npx @angular/cli@10 update @angular/material@10 if you use Material.
4. Update third-party libraries to releases that support the target major.
5. Fix compile errors and deprecation warnings, run the tests and release.
6. Repeat for the next major. The official policy is one major at a time. The next stop is Angular 10.

When it is worth getting help

Each step from v9 is documented, but there are thirteen of them. Help is worth it when the app has little test coverage, when it depends on libraries that stopped publishing releases, or when the team cannot pause feature work for the time the upgrade takes. The order of work for a long upgrade is in Angular upgrade strategy for old versions. If part of the product still runs on AngularJS, start with AngularJS migration.

More in this section

• Angular 10: end of life and how to upgrade
• Angular 11: end of life and how to upgrade
• Angular 12: end of life and how to upgrade
• Angular 13: end of life and how to upgrade