Update Angular to v20 and apply angular versioning#32
Conversation
WalkthroughThe updates introduce Angular 20 support by upgrading dependencies, updating compatibility documentation, and adjusting project configuration for Angular 20 tooling. The import source for the Changes
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
yarn.lockis excluded by!**/yarn.lock,!**/*.lock
📒 Files selected for processing (7)
CHANGELOG.md(1 hunks)README.md(1 hunks)angular.json(2 hunks)package.json(2 hunks)src/account/providers/keycloakify-angular/keycloakify-angular.providers.ts(1 hunks)src/login/providers/keycloakify-angular/keycloakify-angular.providers.ts(1 hunks)src/package.json(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Check if version upgrade
🔇 Additional comments (9)
src/login/providers/keycloakify-angular/keycloakify-angular.providers.ts (1)
5-6:Details
✅ Verification successful
Approve import adjustments for Angular v20
The
provideAppInitializerandDOCUMENTimports have been updated to@angular/coreper Angular v20 API. Ensure no lingering imports ofDOCUMENTfrom@angular/common.
🏁 Script executed:
#!/bin/bash # Verify no remaining DOCUMENT imports from @angular/common rg "import\s*{\s*[^}]*DOCUMENT[^}]*}\s*from\s*'@angular/common'" -nLength of output: 227
🏁 Script executed:
#!/bin/bash # Re-verify no remaining DOCUMENT imports from @angular/common with corrected regex rg -n "import\s*{\s*DOCUMENT\s*}\s*from\s*['\"]@angular/common['\"]" .Length of output: 227
🏁 Script executed:
#!/bin/bash # Search for any import of DOCUMENT from @angular/common across the repository grep -R "import.*DOCUMENT.*from.*@angular/common" -n .Length of output: 56
#!/bin/bash # List all import statements from @angular/common rg -n "from ['\"]@angular/common['\"]" . echo echo "=== Occurrences of DOCUMENT in the repo ===" rg -n "DOCUMENT" .
Approve import adjustments for Angular v20
The
provideAppInitializerandDOCUMENTimports have been updated to@angular/coreper Angular v20 API. A search across the repository shows no remaining imports ofDOCUMENTfrom@angular/common.src/package.json (1)
7-9: Upgrade peer dependencies to Angular v20Updated the peer dependencies for
@angular/core,@angular/common, and@angular/platform-browserto^20.0.0to align with Angular v20 compatibility.src/account/providers/keycloakify-angular/keycloakify-angular.providers.ts (1)
5-6:Details
✅ Verification successful
Approve import adjustments for Angular v20
The
provideAppInitializerandDOCUMENTimports are correctly moved from@angular/commonto@angular/core, matching the login providers change. Confirm consistency across both modules.
🏁 Script executed:
#!/bin/bash # Check for stale DOCUMENT imports in account providers rg "import\s*{\s*[^}]*DOCUMENT[^}]*}\s*from\s*'@angular/common'" -nLength of output: 227
🏁 Script executed:
#!/bin/bash # Check for any stale DOCUMENT imports from @angular/common rg -n "import\s*{[^}]*DOCUMENT[^}]*}\s*from\s*'@angular/common'" # Check for any stale provideAppInitializer imports from @angular/common rg -n "import\s*{[^}]*provideAppInitializer[^}]*}\s*from\s*'@angular/common'"Length of output: 469
🏁 Script executed:
#!/bin/bash # Inspect the Keycloakify Angular providers file for Angular imports file="src/account/providers/keycloakify-angular/keycloakify-angular.providers.ts" echo "Inspecting $file" rg -n "@angular/common" "$file" || echo "✅ No @angular/common imports found." rg -n "@angular/core" "$file" || echo "⚠️ No @angular/core imports found."Length of output: 565
Approve import adjustments for Angular v20
All outdated
@angular/commonimports have been removed and bothprovideAppInitializerandDOCUMENTare now imported from@angular/coreinsrc/account/providers/keycloakify-angular/keycloakify-angular.providers.ts(line 7). No further changes required.CHANGELOG.md (2)
1-1: Ensure changelog header consistencyThe new version entry
20.0.0with the comparison link and date is correctly formatted. Verify the release date matches project milestones.
10-10: Approve added bug fix entry under v0.2.24The additional entry for the
changelogcommit[f2a19d7]is properly placed under version0.2.24. No further adjustments needed.README.md (1)
40-41: Update compatibility table for Angular v20Entries for Angular 20 and 19 are correctly updated to reflect current maintenance status and package versions. Table formatting remains consistent.
angular.json (2)
13-13: Use the new Angular v20 ng-packagr builder
The builder has been correctly updated from@angular-devkit/build-angular:ng-packagrto@angular/build:ng-packagrin line with Angular 20’s tooling.
40-65: Inconsistent summary on schematics placement
The AI summary states the"schematics"block was added under"cli", but here it’s declared at the workspace root. Please confirm this matches the Angular v20 workspace schema and adjust if it should be nested under"cli".Likely an incorrect or invalid review comment.
package.json (1)
3-3: Bump library version to 20.0.0
The major version has been updated from0.2.24to20.0.0to align with Angular v20. Ensure this matches your release plan and changelog.
| "devDependencies": { | ||
| "@angular-devkit/build-angular": "^19.2.12", | ||
| "@angular/cli": "^19.2.12", | ||
| "@angular/common": "^19.2.11", | ||
| "@angular/compiler": "^19.2.11", | ||
| "@angular/compiler-cli": "^19.2.11", | ||
| "@angular/core": "^19.2.11", | ||
| "@angular/platform-browser": "^19.2.11", | ||
| "@eslint/compat": "^1.2.9", | ||
| "@types/node": "^22.15.18", | ||
| "@angular/build": "^20.0.2", | ||
| "@angular/cli": "^20.0.2", | ||
| "@angular/common": "^20.0.3", | ||
| "@angular/compiler": "^20.0.3", | ||
| "@angular/compiler-cli": "^20.0.3", | ||
| "@angular/core": "^20.0.3", | ||
| "@angular/platform-browser": "^20.0.3", | ||
| "@eslint/compat": "^1.3.0", | ||
| "@types/node": "^22.15.31", | ||
| "@vercel/ncc": "^0.38.3", | ||
| "angular-eslint": "^19.4.0", | ||
| "angular-eslint": "^20.0.0", | ||
| "chalk": "^5.4.1", | ||
| "chokidar": "^4.0.3", | ||
| "cli-select": "^1.1.2", | ||
| "conventional-changelog-cli": "^5.0.0", | ||
| "cz-conventional-changelog": "^3.3.0", | ||
| "eslint": "^9.26.0", | ||
| "eslint": "^9.29.0", | ||
| "eslint-config-prettier": "^10.1.5", | ||
| "eslint-plugin-prettier": "^5.4.0", | ||
| "eslint-plugin-prettier": "^5.4.1", | ||
| "eslint-plugin-unused-imports": "^4.1.4", | ||
| "husky": "^4.3.8", | ||
| "keycloakify": "^11.8.27", | ||
| "keycloakify": "^11.8.47", | ||
| "lint-staged": "^11.1.1", | ||
| "ng-packagr": "^19.2.2", | ||
| "ng-packagr": "^20.0.0", | ||
| "npm-check-updates": "^18.0.1", | ||
| "prettier": "^3.5.3", | ||
| "rxjs": "^7.8.2", | ||
| "tslib": "^2.8.1", | ||
| "tsx": "^4.19.4", | ||
| "tsx": "^4.20.3", | ||
| "typescript": "~5.8.3", | ||
| "typescript-eslint": "^8.32.1", | ||
| "zod": "^3.24.4" | ||
| "typescript-eslint": "^8.34.0", | ||
| "zod": "^3.25.64" | ||
| } |
There was a problem hiding this comment.
💡 Verification agent
🧩 Analysis chain
Review Angular and devDependency version alignment
Several Angular packages (@angular/build, @angular/cli) are at ^20.0.2 while core libraries are at ^20.0.3. Aligning patch versions across your Angular devDependencies can prevent subtle mismatches.
🏁 Script executed:
#!/bin/bash
# List all Angular packages and their versions from package.json
jq '.devDependencies
| to_entries[]
| select(.key | test("^@angular/"))' package.jsonLength of output: 480
🏁 Script executed:
#!/bin/bash
# List all @angular packages from both dependencies and devDependencies
jq '(.dependencies // {}) + (.devDependencies // {})
| to_entries[]
| select(.key | test("^@angular/"))' package.jsonLength of output: 510
Align Angular package patch versions
There’s a mismatch between your Angular packages:
- @angular/build and @angular/cli are at
^20.0.2 - All other
@angular/*packages are at^20.0.3
To avoid subtle Angular runtime or build inconsistencies, update the patch versions so they all align.
• In package.json (Lines 38–71):
- "@angular/build": "^20.0.2",
- "@angular/cli": "^20.0.2",
+ "@angular/build": "^20.0.3",
+ "@angular/cli": "^20.0.3",📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "devDependencies": { | |
| "@angular-devkit/build-angular": "^19.2.12", | |
| "@angular/cli": "^19.2.12", | |
| "@angular/common": "^19.2.11", | |
| "@angular/compiler": "^19.2.11", | |
| "@angular/compiler-cli": "^19.2.11", | |
| "@angular/core": "^19.2.11", | |
| "@angular/platform-browser": "^19.2.11", | |
| "@eslint/compat": "^1.2.9", | |
| "@types/node": "^22.15.18", | |
| "@angular/build": "^20.0.2", | |
| "@angular/cli": "^20.0.2", | |
| "@angular/common": "^20.0.3", | |
| "@angular/compiler": "^20.0.3", | |
| "@angular/compiler-cli": "^20.0.3", | |
| "@angular/core": "^20.0.3", | |
| "@angular/platform-browser": "^20.0.3", | |
| "@eslint/compat": "^1.3.0", | |
| "@types/node": "^22.15.31", | |
| "@vercel/ncc": "^0.38.3", | |
| "angular-eslint": "^19.4.0", | |
| "angular-eslint": "^20.0.0", | |
| "chalk": "^5.4.1", | |
| "chokidar": "^4.0.3", | |
| "cli-select": "^1.1.2", | |
| "conventional-changelog-cli": "^5.0.0", | |
| "cz-conventional-changelog": "^3.3.0", | |
| "eslint": "^9.26.0", | |
| "eslint": "^9.29.0", | |
| "eslint-config-prettier": "^10.1.5", | |
| "eslint-plugin-prettier": "^5.4.0", | |
| "eslint-plugin-prettier": "^5.4.1", | |
| "eslint-plugin-unused-imports": "^4.1.4", | |
| "husky": "^4.3.8", | |
| "keycloakify": "^11.8.27", | |
| "keycloakify": "^11.8.47", | |
| "lint-staged": "^11.1.1", | |
| "ng-packagr": "^19.2.2", | |
| "ng-packagr": "^20.0.0", | |
| "npm-check-updates": "^18.0.1", | |
| "prettier": "^3.5.3", | |
| "rxjs": "^7.8.2", | |
| "tslib": "^2.8.1", | |
| "tsx": "^4.19.4", | |
| "tsx": "^4.20.3", | |
| "typescript": "~5.8.3", | |
| "typescript-eslint": "^8.32.1", | |
| "zod": "^3.24.4" | |
| "typescript-eslint": "^8.34.0", | |
| "zod": "^3.25.64" | |
| } | |
| "devDependencies": { | |
| "@angular/build": "^20.0.3", | |
| "@angular/cli": "^20.0.3", | |
| "@angular/common": "^20.0.3", | |
| "@angular/compiler": "^20.0.3", | |
| "@angular/compiler-cli": "^20.0.3", | |
| "@angular/core": "^20.0.3", | |
| "@angular/platform-browser": "^20.0.3", | |
| "@eslint/compat": "^1.3.0", | |
| "@types/node": "^22.15.31", | |
| "@vercel/ncc": "^0.38.3", | |
| "angular-eslint": "^20.0.0", | |
| "chalk": "^5.4.1", | |
| "chokidar": "^4.0.3", | |
| "cli-select": "^1.1.2", | |
| "conventional-changelog-cli": "^5.0.0", | |
| "cz-conventional-changelog": "^3.3.0", | |
| "eslint": "^9.29.0", | |
| "eslint-config-prettier": "^10.1.5", | |
| "eslint-plugin-prettier": "^5.4.1", | |
| "eslint-plugin-unused-imports": "^4.1.4", | |
| "husky": "^4.3.8", | |
| "keycloakify": "^11.8.47", | |
| "lint-staged": "^11.1.1", | |
| "ng-packagr": "^20.0.0", | |
| "npm-check-updates": "^18.0.1", | |
| "prettier": "^3.5.3", | |
| "rxjs": "^7.8.2", | |
| "tslib": "^2.8.1", | |
| "tsx": "^4.20.3", | |
| "typescript": "~5.8.3", | |
| "typescript-eslint": "^8.34.0", | |
| "zod": "^3.25.64" | |
| } |
🤖 Prompt for AI Agents
In package.json between lines 38 and 71, the Angular package versions are
inconsistent, with @angular/build and @angular/cli at ^20.0.2 while other
Angular packages are at ^20.0.3. Update the versions of @angular/build and
@angular/cli to ^20.0.3 to align all Angular package patch versions and prevent
potential runtime or build issues.
2 participants
this PR is for update angular to latest version and to start adopting angular versioning to avoid users confusion on version compatibility.
Summary by CodeRabbit
Documentation
Chores
Refactor