Skip to content

[UPGRADE] Angular 18 → 19 + standalone schematic + new control flow #28

Description

@BAWES

Overview

Final Angular upgrade step. This is the largest issue in the upgrade series as it includes the architectural migration to standalone components and new control flow syntax.

Prerequisites

Scope

1. Version bump

  • Run npx ng update @angular/core@19 @angular/cli@19
  • Update typescript to ~5.6.x

2. Standalone migration (schematic)

Run the schematic in 3 passes as instructed by Angular docs:

# Pass 1: Convert all components/directives/pipes to standalone
npx ng generate @angular/core:standalone

# Pass 2: Remove NgModule classes that became empty
npx ng generate @angular/core:standalone

# Pass 3: Bootstrap the app with standalone APIs
npx ng generate @angular/core:standalone

3. Control flow migration

npx ng generate @angular/core:control-flow

This converts *ngIf@if, *ngFor@for, *ngSwitch@switch.

4. Builder migration

  • Accept the ESBuild/Vite builder migration prompt during ng update for faster builds

5. Cleanup

  • Remove src/polyfills.ts (no longer needed)
  • Remove karma.conf.js if switching to Jest/Vitest (optional, can leave for now)
  • Migrate APP_INITIALIZER to provideAppInitializer if flagged by compiler

Out of Scope

  • Do NOT upgrade Ionic or Capacitor in this issue
  • Do NOT migrate Angular Signals in this issue (separate issue)

Acceptance Criteria

  • ng build --configuration production completes with ESBuild builder
  • ng serve runs without errors
  • No NgModule classes remain (or only intentional ones)
  • No *ngIf / *ngFor directives remain in templates
  • All routes and lazy loading still work correctly

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions