skills.rest
SAP
SAPOFFICIAL
Explore all skills by this author →
Website𝕏@SAPOpenSourceGitHub

migrate

Migrate Angular components and directives to signal-based patterns.

294|147|Updated May 27, 2018
Search Tags:#angular#migration#component#refactor#signals#directive
One-click install
npx skills add https://github.com/SAP/fundamental-ngx --skill migrate-sap
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: migrate
Source: https://github.com/SAP/fundamental-ngx/tree/main/.claude/skills/migrate
Command: npx skills add https://github.com/SAP/fundamental-ngx --skill migrate-sap

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Migrating Angular components and directives to signal-based patterns to modernize codebases and improve reactive behavior with fewer lifecycle pitfalls.

Core Features & Use Cases

  • Provides a guided, phase-based migration path from Input/Output-centric components to signal-driven APIs.
  • Generates a plan that preserves existing behavior while enabling progressive refactoring across files and modules.
  • Suitable for Angular 21+ upgrades where decorators like @Input/@Output and HostBindings need to be converted to signals and related APIs.

Quick Start

Review the target component path and initiate the migration plan to generate a step-by-step refactor outline.

Frequently Asked Questions about migrate

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

FAQPage Schema
How do I migrate Angular components to signals?▼

Migrating Angular components to signals requires a structured, phase-based migration plan that transforms @Input() and @Output() decorators into signal-driven APIs. This process preserves existing component behavior while progressively refactoring files and modules to modernize reactivity.

What is the best way to refactor Angular HostBindings into signals?▼

The best way to refactor Angular HostBindings into signals is through a guided phase-based migration path. This approach systematically converts decorators to signal-based patterns and related APIs, reducing lifecycle pitfalls and improving reactive behavior across upgraded codebases.

Can I use signal-based migration for Angular 21 upgrades?▼

Yes, you can use signal-based migration for Angular 21+ upgrades. The migration specifically targets codebases upgrading to Angular 21+, guiding the transformation from Input and Output-centric components to signal-driven APIs while enforcing frontmatter-driven metadata.

How does converting Angular decorators to signals preserve existing behavior?▼

Converting Angular decorators to signals preserves behavior by generating a progressive refactoring plan across files and modules. The migration enforces frontmatter-driven metadata and systematically guides the transformation, ensuring the original component functionality remains intact during the upgrade.

Why does migrating Angular directives to signals reduce lifecycle pitfalls?▼

Migrating Angular directives to signals reduces lifecycle pitfalls because signal-based patterns modernize codebases and improve reactive behavior. By replacing traditional decorators with signal-driven APIs, components rely on proactive state tracking rather than manual lifecycle management.

Related Skills

Explore More Software Engineering Skills→
oguzhan18oguzhan18
6

angular-components

Design and optimize Angular components with signal-based inputs and outputs.

Community
Intermediate
RJJJJRJJJJ

ai-slop-cleaner

Refactor AI-generated outputs by removing duplication, dead code, boundary violations, and missing tests with regression-first workflow.

Community
Advanced
analogjsanalogjs
595

angular-signals

Implements signal-based reactive state management for Angular 20+ components.

Official
Advanced
analogjsanalogjs
595

angular-http

Fetch API data using signal-based HTTP resources in Angular v20+.

Official
Intermediate