migrate-antd-v6

Migrate antdV3 imports to antd v6 with Playwright screenshot verification.

2|Updated Apr 11, 2026
One-click install
npx skills add https://github.com/wilsonfaustino/ai-tools --skill migrate-antd-v6
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: migrate-antd-v6
Source: https://github.com/wilsonfaustino/ai-tools/tree/main/skills/migrate-antd-v6
Command: npx skills add https://github.com/wilsonfaustino/ai-tools --skill migrate-antd-v6

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Manually migrating deprecated antd v3 (antdV3 npm alias) imports to antd v6 carries high risk of introducing silent visual and behavior regressions in production UI, with no reliable way to verify changes are safe before committing.

Core Features & Use Cases

  • Single-target scoped migration: Limits changes to one specified file or route, never performing repo-wide sweeps of remaining antdV3 holdouts.
  • Regression-proof verification: Captures before/after Playwright screenshots of real rendered routes, including loading states and real user interaction behavior checks, to catch visual and functional regressions.
  • Repo-convention aligned: Discovers and matches the target repository's existing antd v6 code patterns to ensure migrated code fits seamlessly with the existing codebase. Use this skill when a Sonar no-restricted-imports MAJOR alert flags an antdV3 import, or a product owner requests migrating a specific component to antd v6.

Quick Start

Use the migrate-antd-v6 skill to migrate the target file src/components/LegacyForm.tsx from antdV3 to antd v6, capturing before/after screenshots of the /user-settings route to verify no visual or behavior regressions before you commit the changes.

Frequently Asked Questions about migrate-antd-v6

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

FAQPage Schema
How do I migrate antd v3 components to v6 without introducing visual regressions?

To migrate antd v3 to v6 without regressions, scope changes to a single file or route and capture before/after Playwright screenshots of real rendered routes. This verifies loading states and interaction behaviors, halting at a signed commit for owner approval before changes are finalized.

What's the best way to update deprecated antdV3 imports flagged by Sonar no-restricted-imports alerts?

The best way to update deprecated antdV3 imports flagged by Sonar alerts is targeted single-file migration. Instead of repo-wide sweeping, it scopes work to the flagged component, matching existing antd v6 patterns to ensure migrated code fits seamlessly with the codebase.

Does antd v6 migration require Playwright for visual regression testing?

Playwright is used for visual regression testing during antd v6 migration by capturing before/after screenshots of real rendered routes. It enforces real user interaction behavior checks to catch functional and visual regressions before committing code changes.

Can I perform a repo-wide sweep to migrate all remaining antdV3 holdouts at once?

You cannot perform repo-wide sweeping of remaining antdV3 holdouts with this approach. Migration is strictly scoped to a single specified target file or route, preventing unvetted code changes and limiting the blast radius of potential regressions.

How do I ensure migrated antd v6 code matches my repository's existing conventions?

To ensure migrated antd v6 code matches your repository conventions, the migration process discovers and matches the target repository's existing antd v6 code patterns. This guarantees the updated component fits seamlessly into the current codebase without style conflicts.

When do I need to halt an antd v3 to v6 component migration for approval?

You need to halt an antd v3 to v6 component migration at a signed commit command for owner approval. This prevents unvetted code changes from being merged, ensuring visual and behavior regressions are reviewed before finalizing the migration.