Migrate OneCX App from Angular 18 to Angular 19
Overview
This guide provides comprehensive step-by-step instructions for migrating OneCX applications from Angular 18 to Angular 19. As part of upgrading to Angular 19, you must update your OneCX UI libraries to version 6. This library update is not a standalone migration but a required part of the Angular version upgrade process, as OneCX v6 libraries provide Angular 19 compatibility and include necessary breaking changes.
Prerequisites
Before starting this migration:
-
Your OneCX application is currently running on Angular 18
-
You have OneCX UI libraries v5.x installed
-
You have a working development environment
AI Driven Migration Assistance
To assist with the migration process, you can utilize the AI-driven migration assistant. Below you can find the migration prompt, which you can copy and use in your preferred AI tool. This prompt has been tested with github copilot GPT-5.2 in agent mode.
AI Migration Prompt
Role: You are a senior frontend engineer with expert‑level knowledge of Angular and OneCX. Your responsibility is to perform all OneCX‑specific migration tasks required to prepare and finalize a OneCX application for an upgrade from Angular 18 → Angular 19. Important: You do NOT perform the Angular framework upgrade itself unless explicitly instructed. You only implement OneCX‑specific pre‑migration and post‑migration tasks. All actions must strictly follow official OneCX documentation. Never skip steps unless explicitly instructed. Workflow Follow these steps in strict order: 1. Retrieve Documentation Fetch the documentation page titled "Migrate OneCX App from Angular 18 to Angular 19" using the OneCX Documentation MCP server. Only if the MCP server is unavailable, fall back to the public URL: https://onecx.github.io/docs/documentation/current/onecx-portal-ui-libs/migrations/angular-19/index.html 2. Extract Migration Steps & Create Plan File From the documentation: Extract pre‑migration steps Extract post‑migration steps Then: Combine them into a structured migration plan Include the additional tasks provided by the developer Save the plan to a file so the developer can track progress Update the file every time you complete a step 3. Notify Developer Tell the developer: Where the plan file is located That you are starting the pre‑migration phase 4. Execute Pre‑Migration Perform all pre‑migration tasks exactly as described in the documentation. Do not skip or reorder steps. 5. Request Developer Action When pre‑migration is complete: Inform the developer Tell them you are waiting for their “go‑ahead” Remind them they must complete the Angular 18 → 19 upgrade before you proceed 6. Execute Post‑Migration Once the developer explicitly instructs you: Complete all post‑migration tasks in order 7. Request Version Information After completing all post‑migration steps: Ask the developer for the Angular and OneCX versions they want installed 8. Install Specified Versions Install exactly the package versions the developer provides. 9. Final Verification Run: Plain Text npm run build npm run test Report the results. Rules Follow the steps exactly without assumptions. After angular 19 installation if "Component is standalone, and cannot be declared in an NgModule" error appears, add 'standalone: false' to component declararion. If the guide shows a change for styles.scss, apply it verbatim in styles.scss. If it doesn’t compile, stop and ask me which adaptation to use (Nx styles array vs Sass @import, and exact path format). Do not auto-adapt. Never skip requirements without explicit instruction. All reasoning and actions must be grounded in official documentation only. Ask for clarification only when strictly necessary.
Migration Steps before upgrading to Angular 19
To simplify the migration process, it is recommended to complete the following steps before upgrading to Angular 19. You can click the name of any change to open a detailed migration guide with instructions, code examples, and explanations.
After these steps are completed, it is recommended to build the application to ensure that there are no remaining issues before proceeding with the Angular 19 upgrade:
npm run build
Upgrade to Angular 19
After completing the pre-migration steps, you can proceed with upgrading your application to Angular 19. Follow the official Angular update guide to perform the version upgrade by following this link: Angular Update Guide.