From e004103913dabef30b7fd4c5f9c70cadbc4c664c Mon Sep 17 00:00:00 2001 From: David Dal Busco Date: Fri, 21 Nov 2025 07:22:57 +0100 Subject: [PATCH 1/2] feat: migrate templates to Angular v21 Signed-off-by: David Dal Busco --- templates/angular-starter/angular.json | 8 ++++---- templates/angular-starter/package.json | 24 ++++++++++++------------ templates/angular-starter/src/main.ts | 8 +++++--- templates/angular-starter/tsconfig.json | 5 ++--- 4 files changed, 23 insertions(+), 22 deletions(-) diff --git a/templates/angular-starter/angular.json b/templates/angular-starter/angular.json index dd4b8421..d2a8b135 100644 --- a/templates/angular-starter/angular.json +++ b/templates/angular-starter/angular.json @@ -15,7 +15,7 @@ "prefix": "app", "architect": { "build": { - "builder": "@angular-devkit/build-angular:application", + "builder": "@angular/build:application", "options": { "outputPath": "dist/angular-starter", "index": "src/index.html", @@ -58,7 +58,7 @@ "defaultConfiguration": "production" }, "serve": { - "builder": "@angular-devkit/build-angular:dev-server", + "builder": "@angular/build:dev-server", "configurations": { "production": { "buildTarget": "angular-starter:build:production" @@ -70,13 +70,13 @@ "defaultConfiguration": "development" }, "extract-i18n": { - "builder": "@angular-devkit/build-angular:extract-i18n", + "builder": "@angular/build:extract-i18n", "options": { "buildTarget": "angular-starter:build" } }, "test": { - "builder": "@angular-devkit/build-angular:karma", + "builder": "@angular/build:karma", "options": { "polyfills": ["zone.js", "zone.js/testing"], "tsConfig": "tsconfig.spec.json", diff --git a/templates/angular-starter/package.json b/templates/angular-starter/package.json index 2c72f7f1..023ff611 100644 --- a/templates/angular-starter/package.json +++ b/templates/angular-starter/package.json @@ -15,14 +15,14 @@ }, "private": true, "dependencies": { - "@angular/animations": "^20.2.4", - "@angular/common": "^20.2.4", - "@angular/compiler": "^20.2.4", - "@angular/core": "^20.2.4", - "@angular/forms": "^20.2.4", - "@angular/platform-browser": "^20.2.4", - "@angular/platform-browser-dynamic": "^20.2.4", - "@angular/router": "^20.2.4", + "@angular/animations": "^21.0.0", + "@angular/common": "^21.0.0", + "@angular/compiler": "^21.0.0", + "@angular/core": "^21.0.0", + "@angular/forms": "^21.0.0", + "@angular/platform-browser": "^21.0.0", + "@angular/platform-browser-dynamic": "^21.0.0", + "@angular/router": "^21.0.0", "@junobuild/core": "^3.1.0", "@junobuild/functions": "^0.4.0", "rxjs": "~7.8.2", @@ -30,9 +30,9 @@ "zone.js": "^0.15.1" }, "devDependencies": { - "@angular-devkit/build-angular": "^20.2.2", - "@angular/cli": "^20.2.2", - "@angular/compiler-cli": "^20.2.4", + "@angular/build": "^21.0.0", + "@angular/cli": "^21.0.0", + "@angular/compiler-cli": "^21.0.0", "@tailwindcss/postcss": "^4.1.13", "@types/jasmine": "~5.1.9", "angular-eslint": "20.2.0", @@ -43,7 +43,7 @@ "karma-coverage": "~2.2.1", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.1.0", - "postcss": "^8.5.6", + "postcss": "^8.5.3", "prettier": "^3.6.2", "prettier-plugin-tailwindcss": "^0.6.14", "tailwindcss": "^4.1.13", diff --git a/templates/angular-starter/src/main.ts b/templates/angular-starter/src/main.ts index 64584d49..d7338f12 100644 --- a/templates/angular-starter/src/main.ts +++ b/templates/angular-starter/src/main.ts @@ -1,3 +1,4 @@ +import { provideZoneChangeDetection } from '@angular/core'; import { bootstrapApplication } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { appConfig } from './app/app.config'; @@ -8,6 +9,7 @@ import { appConfig } from './app/app.config'; // eslint-disable-next-line (window as any).global = window; -bootstrapApplication(AppComponent, appConfig).catch((err) => - console.error(err), -); +bootstrapApplication(AppComponent, { + ...appConfig, + providers: [provideZoneChangeDetection(), ...appConfig.providers], +}).catch((err) => console.error(err)); diff --git a/templates/angular-starter/tsconfig.json b/templates/angular-starter/tsconfig.json index 67d29443..84fdc5b7 100644 --- a/templates/angular-starter/tsconfig.json +++ b/templates/angular-starter/tsconfig.json @@ -13,12 +13,11 @@ "sourceMap": true, "declaration": false, "experimentalDecorators": true, - "moduleResolution": "node", + "moduleResolution": "bundler", "importHelpers": true, "target": "ES2022", "module": "ES2022", - "useDefineForClassFields": false, - "lib": ["ES2022", "dom"] + "useDefineForClassFields": false }, "angularCompilerOptions": { "enableI18nLegacyMessageIdFormat": false, From 0f066f0ebed4845b745b9a8df882a55f0c25fb14 Mon Sep 17 00:00:00 2001 From: David Dal Busco Date: Fri, 21 Nov 2025 07:26:51 +0100 Subject: [PATCH 2/2] feat: migrate templates to Angular v21 Signed-off-by: David Dal Busco --- templates/angular-example/angular.json | 8 ++++---- templates/angular-example/package.json | 24 ++++++++++++------------ templates/angular-example/src/main.ts | 8 +++++--- templates/angular-example/tsconfig.json | 5 ++--- 4 files changed, 23 insertions(+), 22 deletions(-) diff --git a/templates/angular-example/angular.json b/templates/angular-example/angular.json index 994e2c1a..29ff65bf 100644 --- a/templates/angular-example/angular.json +++ b/templates/angular-example/angular.json @@ -15,7 +15,7 @@ "prefix": "app", "architect": { "build": { - "builder": "@angular-devkit/build-angular:application", + "builder": "@angular/build:application", "options": { "outputPath": "dist/angular-example", "index": "src/index.html", @@ -58,7 +58,7 @@ "defaultConfiguration": "production" }, "serve": { - "builder": "@angular-devkit/build-angular:dev-server", + "builder": "@angular/build:dev-server", "configurations": { "production": { "buildTarget": "angular-example:build:production" @@ -70,13 +70,13 @@ "defaultConfiguration": "development" }, "extract-i18n": { - "builder": "@angular-devkit/build-angular:extract-i18n", + "builder": "@angular/build:extract-i18n", "options": { "buildTarget": "angular-example:build" } }, "test": { - "builder": "@angular-devkit/build-angular:karma", + "builder": "@angular/build:karma", "options": { "polyfills": ["zone.js", "zone.js/testing"], "tsConfig": "tsconfig.spec.json", diff --git a/templates/angular-example/package.json b/templates/angular-example/package.json index 2a454aff..9c160c2e 100644 --- a/templates/angular-example/package.json +++ b/templates/angular-example/package.json @@ -15,14 +15,14 @@ }, "private": true, "dependencies": { - "@angular/animations": "^20.2.4", - "@angular/common": "^20.2.4", - "@angular/compiler": "^20.2.4", - "@angular/core": "^20.2.4", - "@angular/forms": "^20.2.4", - "@angular/platform-browser": "^20.2.4", - "@angular/platform-browser-dynamic": "^20.2.4", - "@angular/router": "^20.2.4", + "@angular/animations": "^21.0.0", + "@angular/common": "^21.0.0", + "@angular/compiler": "^21.0.0", + "@angular/core": "^21.0.0", + "@angular/forms": "^21.0.0", + "@angular/platform-browser": "^21.0.0", + "@angular/platform-browser-dynamic": "^21.0.0", + "@angular/router": "^21.0.0", "@junobuild/core": "^3.1.0", "@junobuild/functions": "^0.4.0", "nanoid": "^5.1.5", @@ -31,9 +31,9 @@ "zone.js": "^0.15.1" }, "devDependencies": { - "@angular-devkit/build-angular": "^20.2.2", - "@angular/cli": "^20.2.2", - "@angular/compiler-cli": "^20.2.4", + "@angular/build": "^21.0.0", + "@angular/cli": "^21.0.0", + "@angular/compiler-cli": "^21.0.0", "@tailwindcss/postcss": "^4.1.13", "@types/jasmine": "~5.1.9", "angular-eslint": "20.2.0", @@ -44,7 +44,7 @@ "karma-coverage": "~2.2.1", "karma-jasmine": "~5.1.0", "karma-jasmine-html-reporter": "~2.1.0", - "postcss": "^8.5.6", + "postcss": "^8.5.3", "prettier": "^3.6.2", "prettier-plugin-tailwindcss": "^0.6.14", "tailwindcss": "^4.1.13", diff --git a/templates/angular-example/src/main.ts b/templates/angular-example/src/main.ts index 64584d49..d7338f12 100644 --- a/templates/angular-example/src/main.ts +++ b/templates/angular-example/src/main.ts @@ -1,3 +1,4 @@ +import { provideZoneChangeDetection } from '@angular/core'; import { bootstrapApplication } from '@angular/platform-browser'; import { AppComponent } from './app/app.component'; import { appConfig } from './app/app.config'; @@ -8,6 +9,7 @@ import { appConfig } from './app/app.config'; // eslint-disable-next-line (window as any).global = window; -bootstrapApplication(AppComponent, appConfig).catch((err) => - console.error(err), -); +bootstrapApplication(AppComponent, { + ...appConfig, + providers: [provideZoneChangeDetection(), ...appConfig.providers], +}).catch((err) => console.error(err)); diff --git a/templates/angular-example/tsconfig.json b/templates/angular-example/tsconfig.json index 67d29443..84fdc5b7 100644 --- a/templates/angular-example/tsconfig.json +++ b/templates/angular-example/tsconfig.json @@ -13,12 +13,11 @@ "sourceMap": true, "declaration": false, "experimentalDecorators": true, - "moduleResolution": "node", + "moduleResolution": "bundler", "importHelpers": true, "target": "ES2022", "module": "ES2022", - "useDefineForClassFields": false, - "lib": ["ES2022", "dom"] + "useDefineForClassFields": false }, "angularCompilerOptions": { "enableI18nLegacyMessageIdFormat": false,