Skip to content
cccskills
FreePublished on GitHub

ant-design

Decision guide for antd 6.x, Ant Design Pro 5/ProComponents, Ant Design X v2, and the offline `@ant-design/cli`. Use for component selection, theming/tokens, SSR, a11y, performance, routing/access/CRUD, AI/chat UI patterns, local API lookup, debugging, migration, and usage analysis.

The English summary is being prepared. Showing the original description.

See how to install

Files included (3)

  • SKILL.md4.3 KB
  • LICENSE1.1 KB
  • references/antd-cli.md3.7 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

Ant Design

S - Scope

  • Target: antd@^6 + React 18-19, with ant-design-pro@^5 / @ant-design/pro-components and @ant-design/x@^2 when needed.
  • Tooling: @ant-design/cli for offline component metadata, demos, changelogs, migrations, linting, doctor checks, and usage analysis.
  • Focus: decision guidance only; no end-user tutorials.
  • Source policy: official docs only; no undocumented APIs or internal .ant-* coupling.

Default assumptions

  • Language: TypeScript.
  • Styling: tokens first, then classNames/styles; avoid global overrides.
  • Provider: one root ConfigProvider unless strict isolation is required.

Mandatory rules

  • Before writing or changing antd component code, query the component API first with antd info <Component> --format json. Do not rely on memory when the CLI can answer it offline.
  • Always use --format json with antd CLI commands.
  • If the project version matters, match it with --version <x.y.z> or let the CLI auto-detect from local node_modules.
  • After changing antd code, run antd lint <changed-path> --format json.
  • If an antd CLI command crashes, returns wrong data, or violates its documented behavior, prepare an antd bug-cli preview for user confirmation instead of silently working around it.
  • For component questions, first map the component name to the official route slug {components} (lowercase kebab-case, e.g. TreeSelect -> tree-select, Button -> button), then request docs in this order (CN first, EN fallback):
    1. https://ant.design/components/{components}-cn
    2. https://ant.design/components/{components}
    • Examples: tree-select-cn -> tree-select, button-cn -> button.
  • Use only documented antd/Pro/X APIs.
  • Do not invent props/events/component names.
  • Do not rely on internal DOM or .ant-* selectors.
  • Theme priority: global tokens -> component tokens -> alias tokens.

P - Process

1) Classify

  • Identify layer: core antd, Pro, or X.
  • Confirm version, rendering mode (CSR/SSR/streaming), data scale, and whether @ant-design/cli should be the primary lookup path.

2) Query authoritative sources

  • Prefer local @ant-design/cli first for structured lookup:
    • antd info for props/API
    • antd demo for a working baseline
    • antd doc for full docs
    • antd token / antd semantic for theming and styling hooks
    • antd doctor, antd lint, antd usage, antd migrate, antd changelog when debugging or upgrading
  • Then request the official component docs (-cn first, EN fallback) when narrative docs or cross-checking are needed.

3) Decide

  • Provider baseline: CSR -> ConfigProvider; SSR -> ConfigProvider + StyleProvider.
  • Theming baseline: global tokens -> component tokens -> classNames/styles.
  • Output recommendation + risk + verification points (SSR/a11y/perf), citing CLI findings when used.

O - Output

  • Provide short decision rationale (1-3 sentences).
  • Include minimal provider/theming strategy.
  • Include concrete SSR/a11y/perf checks.
  • For Pro: include route/menu/access and CRUD schema direction.
  • For X: include message/tool schema and streaming state direction.

References

FileUse when
references/antd-cli.mdYou need the exact offline CLI workflow for API lookup, demos, linting, doctor checks, migration, changelog review, usage analysis, or bug reporting.

Regression checklist

  • One root ConfigProvider; SSR style order/hydration verified.
  • Tokens first; no broad global .ant-* overrides.
  • Table has stable rowKey; sort/filter/pagination entry is unified.
  • Select remote mode disables local filter when using remote search.
  • Upload controlled/uncontrolled mode is explicit with failure/retry path.
  • Pro route/menu/access remain consistent with backend enforcement.
  • X streaming supports stop/retry and deterministic tool rendering.
  • If antd CLI was used, commands ran with --format json and any CLI defect was escalated via antd bug-cli preview.

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

antd

Free

Use when the user's task involves Ant Design (antd) — writing antd components, debugging antd issues, querying antd APIs/props/tokens/demos, migrating between antd versions, or analyzing antd usage in a project. Triggers on antd-related code, imports from 'antd', or explicit antd questions.

The English summary is being prepared. Showing the original description.

ant-design/antd-skill136Updated Mar 27, 2026

See all skills by ant-design

Report a problem with this skill