angular-migration

Migrates AngularJS (1.x) applications to Angular (2+) with ngUpgrade-based hybrid setups.

1|Updated Dec 23, 2025
One-click install
npx skills add https://github.com/ccf/claude-code-ccf-marketplace --skill angular-migration-ccf
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: angular-migration
Source: https://github.com/ccf/claude-code-ccf-marketplace/tree/main/plugins/refactoring/skills/angular-migration
Command: npx skills add https://github.com/ccf/claude-code-ccf-marketplace --skill angular-migration-ccf

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

Migrate AngularJS (1.x) applications to Angular (2+), enabling incremental upgrades and hybrid architectures to modernize codebases without rewriting everything at once.

Core Features & Use Cases

  • Hybrid app support: enable AngularJS and Angular to co-exist during migration.
  • Component migration: convert directives to Angular components with minimal API changes.
  • Routing and DI modernization: update routing, dependency injection, and services to Angular patterns.
  • Use Case: Upgrade a large dashboard gradually by migrating feature modules one at a time.

Quick Start

Consult this Skill to plan and execute an AngularJS-to-Angular migration for an existing app. For example: "Prepare a migration plan to upgrade the user module from AngularJS to Angular using ngUpgrade and incremental component rewrites."

Frequently Asked Questions about angular-migration

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I migrate an AngularJS app to Angular without rewriting everything at once?

You can migrate an AngularJS app to Angular incrementally by using ngUpgrade to enable a hybrid setup where both frameworks co-exist. This allows you to rewrite feature modules one at a time instead of rewriting the entire codebase.

How does ngUpgrade interop work for incremental Angular migrations?

ngUpgrade interop enables hybrid application setups by allowing AngularJS and Angular to run simultaneously during migration. It supports routing and dependency injection modernization so you can bridge services and update components seamlessly across both frameworks.

What is the best way to convert AngularJS directives to Angular components?

The best way to convert AngularJS directives to Angular components is through guided component migration, which rewrites directives with minimal API changes. This approach modernizes legacy codebases while maintaining application functionality during the transition.

Can I migrate a large legacy AngularJS dashboard gradually by feature module?

Yes, you can migrate a large legacy AngularJS dashboard gradually by upgrading feature modules one at a time. This incremental upgrade approach uses hybrid architectures to modernize routing, DI, and services without disrupting the entire application.

How do I plan a migration timeline for upgrading AngularJS services and routing?

You can plan a migration timeline for upgrading AngularJS services and routing by consulting best practices for incremental component rewrites. This involves mapping directive-to-component conversions and scheduling DI modernization across teams systematically.

What are the limitations of using a hybrid AngularJS and Angular architecture?

Hybrid AngularJS and Angular architectures require maintaining two frameworks concurrently, which increases bundle size and build complexity during the transition. Careful component migration planning is needed to avoid performance degradation before the full upgrade completes.