Skip to content
Get packs

Guide · Agent skill

How to use the Angular Migration Guide agent skill

Updated · written with AI from the project's own documentation and checked against our catalogue data

The angular-migration skill gives an AI agent a reference of patterns for moving an AngularJS (1.x) application to modern Angular. Once it is installed, the agent can explain migration strategies, set up a hybrid app that runs both frameworks together, and convert controllers, directives, services, dependency injection and routes using before-and-after examples. This guide covers what the skill does, how to install it, how to trigger it, and where its limits are.

Angular Migration Guidewshobson/agents · MIT

Quick start

  1. 1Download the ZIP. Get the angular-migration ZIP from this page.
  2. 2Unzip into the skills folder. Extract it into ~/.claude/skills/ for all projects, or into a project's .claude/skills/ folder for one project.
  3. 3Or upload in the Claude apps. In the Claude apps, go to Settings → Capabilities → Skills and upload the ZIP.
  4. 4Describe your migration task. Ask in plain language, naming AngularJS or Angular and the piece you want to move.
  5. 5Review the generated code. Check examples against your Angular version and adapt them to your own names and services.
  6. 6Test the result. Run your tests and check behaviour before shipping each converted part.

What is an agent skill and what does this one do?

An agent skill is a folder containing a SKILL.md file with instructions that an AI agent loads when a request matches the skill's description. This skill is for teams upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.

The skill covers three strategies: Big Bang (a complete rewrite, best for small apps or greenfield projects), Incremental (a hybrid approach running AngularJS and Angular side by side with ngUpgrade, best for large apps and continuous delivery), and Vertical Slice (migrating one feature completely at a time, best for medium apps with distinct features).

  • Hybrid app bootstrap using UpgradeModule
  • Controller and directive conversion to Angular components
  • Service conversion from $http to HttpClient
  • Dependency injection in both directions with downgradeInjectable and an InjectionToken
  • Routing conversion from $routeProvider to Angular Router
  • Forms examples in the references/details.md file

How do you install the angular-migration skill?

Download the ZIP file for the skill from this page. The skill is made of two files, SKILL.md and references/details.md, so unzip the archive so the angular-migration folder keeps those files.

For a personal install, unzip the skill into ~/.claude/skills/. To limit it to one project, unzip it into the project's .claude/skills/ folder instead.

If you use the Claude apps, you can upload the ZIP under Settings → Capabilities → Skills instead.

~/.claude/skills/angular-migration/SKILL.md

How do you trigger the skill with natural requests?

You do not need a special command. Describe the migration task in plain language and mention AngularJS or Angular, because the skill's description targets upgrading AngularJS applications, planning framework migrations, and modernizing legacy Angular code.

Requests that fit the skill include planning which strategy suits your app, converting a specific controller or directive, or asking how to run AngularJS and Angular together.

  • "Plan an incremental migration from AngularJS 1.x to Angular for our admin app."
  • "Convert this UserController to an Angular component."
  • "Show me how to downgrade an Angular service so an AngularJS controller can use it."
  • "Convert our $routeProvider routes to Angular Router."

What should you expect from the output?

The skill is a reference of patterns and code templates. It does not run any tooling itself, and it does not convert a codebase automatically. The agent adapts the examples to your code by hand.

The templates use older APIs such as NgModule and ngUpgrade. Check them against the Angular version you use before applying them, because current releases may differ. Review and test all generated code.

What does the skill need, and is it safe to run?

The skill lists no requirements. It does not run scripts and does not use the network, so it only supplies instructions and examples to the agent.

Because it runs no scripts and makes no network calls, the main risk is applying outdated code. Treat the output as a draft.

  • Requires: nothing listed
  • Runs scripts: no
  • Uses network: no

Tips for getting good results

Give the agent your actual files so it can adapt the before-and-after examples to your names and services rather than generic ones.

Name the strategy you want, or describe your app size and release process so the agent can recommend one. Ask for one feature at a time to keep changes reviewable.

  • Start with the strategy question before converting code.
  • Convert one controller, directive or service per request.
  • Run your test suite after each change.

What people use it for

  • Choosing between Big Bang, Incremental and Vertical Slice for an app of a given size
  • Setting up a hybrid app that bootstraps UpgradeModule alongside AngularJS
  • Converting an AngularJS controller and its $scope logic into an Angular component
  • Converting a directive with isolated scope bindings into an Angular component with @Input and @Output
  • Converting $http services and $routeProvider routes into HttpClient services and Angular Router

Frequently asked questions

Is the angular-migration skill free to use?

The skill is published under the MIT licence, as listed on this page. Check the licence file in the source repository for the full terms.

What do I need to use the angular-migration skill?

The skill lists no requirements. You need an agent that supports skills and an AngularJS project to apply the patterns to.

Where do I install the angular-migration skill?

Unzip it into ~/.claude/skills/ for a personal install, or into a project's .claude/skills/ folder. In the Claude apps, upload the ZIP under Settings → Capabilities → Skills.

Will the skill convert my AngularJS code automatically?

No. It is a reference of patterns and templates and does not run any tooling. The agent adapts the examples to your code by hand, so you must review and test the output.

Does the skill run scripts or access the internet?

No. The skill runs no scripts and uses no network access.

Can I use this skill for an app that is already on modern Angular?

Not really. The patterns target the AngularJS-to-Angular path, so projects not using AngularJS or already fully on modern Angular are not a good fit.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use this skill if you have a large AngularJS codebase and want to migrate gradually, or if you need example conversions of controllers, directives, services or routes. Skip it if you want an automated code converter or your project is not on the AngularJS path, and check every template against your Angular version before use.

Download the skill