Skip to content
ToolShedby Wasim Shaikh

Angular Upgrade Planner

Pick a source and target Angular version (8–22) for an ordered, checkable upgrade plan — ng update commands, breaking changes, deprecations, and migrations.

Choose your upgrade path

Angular 20 → Angular 210 of 9 done · 1 hop
1

Angular 20 → Angular 21

(9 steps)
Pre-flight

Commit or stash all work, then make sure you are on the latest minor/patch of your current major before running ng update. Upgrade exactly one major at a time and run the app/tests after each hop.

Tooling / Requirements

Angular 21 requires Node.js 20.19+, 22.12+, or 24, and TypeScript 5.9 (up to <6.0).

Check your Node.js & TypeScript versions for Angular 21 →
Update Command

Update the core framework and CLI together. This applies the official automatic migration schematics for this version.

ng update @angular/core@21 @angular/cli@21
Breaking Change

Applications are zoneless unless they provide Zone.js change detection. The ng update migration adds provideZoneChangeDetection() to existing apps so they keep working; review code that relies on Zone.js patching before removing it.

Breaking Change

New projects use Vitest. Existing projects keep Karma, which is still supported (new projects can opt in with --test-runner=karma). The experimental Jest and Web Test Runner builders are slated for removal in v22.

Convert Jasmine specs to Vitest online →
Breaking Change

typeCheckHostBindings is now on by default, so invalid host binding and @HostBinding/@HostListener expressions become compile errors. Fix what the compiler flags, or turn the option off temporarily.

Migration / Adoption

HttpClient is available from the root injector without calling provideHttpClient(). Keep provideHttpClient() when you need interceptors or features such as withFetch().

Migration / Adoption

Angular now recommends native [class] and [style] bindings over NgClass and NgStyle, and provides migrations for both.

ng generate @angular/core:ngclass-to-class
Migration / Adoption

Signal Forms ship as an experimental API — a signal-based alternative to reactive forms. Try it in non-critical areas; it becomes stable in v22.

Sources: Angular Update Guide: v20 → v21 · Angular 21.0.0 release notes · Announcing Angular v21 (Angular Blog)

Tip: Upgrade one major at a time and run ng update for each hop — it applies the official migration schematics automatically. Commit between hops and run your tests. This is a representative checklist of the major changes; always confirm specifics against the official Angular Update Guide for your exact versions.

Upgrading Angular 20 to Angular 21

This plan covers the full path from Angular 20 to Angular 21 — 1 version hop and 9 steps in total. Upgrade one major at a time, running ng update for each hop so the official migration schematics apply. Commit and run your tests between hops.

Breaking changes to check between Angular 20 and Angular 21

  • Zoneless change detection is the default (Angular 20 → Angular 21): Applications are zoneless unless they provide Zone.js change detection. The ng update migration adds provideZoneChangeDetection() to existing apps so they keep working; review code that relies on Zone.js patching before removing it.
  • Vitest replaces Karma as the default test runner (Angular 20 → Angular 21): New projects use Vitest. Existing projects keep Karma, which is still supported (new projects can opt in with --test-runner=karma). The experimental Jest and Web Test Runner builders are slated for removal in v22.
  • Host bindings are type-checked by default (Angular 20 → Angular 21): typeCheckHostBindings is now on by default, so invalid host binding and @HostBinding/@HostListener expressions become compile errors. Fix what the compiler flags, or turn the option off temporarily.

Hops in this path

  1. Angular 20 → Angular 21 — 9 steps

Before you start

  • Commit or stash your work and upgrade on a branch so you can roll back.
  • Get on the latest minor/patch of Angular 20 before the first hop.
  • Update third-party libraries (including Angular Material/CDK) alongside each hop, and run your tests after each one.

Sources

Every step in this plan is checked against Angular's official documentation and release notes. Last reviewed .