{ "markdown": "
\n\n
\n\n\"Ant\n\n

Ant Design CLI

\n\n**Ant Design on your command line.**
\nQuery component knowledge, analyze project usage, and guide migrations — fully offline.\n\n
\n\n[![npm version](https://img.shields.io/npm/v/@ant-design/cli?color=blue&label=npm)](https://www.npmjs.com/package/@ant-design/cli)\n[![npm downloads](https://img.shields.io/npm/dm/@ant-design/cli?color=blue)](https://www.npmjs.com/package/@ant-design/cli)\n[![CI](https://github.com/ant-design/ant-design-cli/actions/workflows/ci.yml/badge.svg)](https://github.com/ant-design/ant-design-cli/actions/workflows/ci.yml)\n[![codecov](https://codecov.io/gh/ant-design/ant-design-cli/branch/main/graph/badge.svg)](https://codecov.io/gh/ant-design/ant-design-cli)\n[![install size](https://packagephobia.com/badge?p=@ant-design/cli)](https://packagephobia.com/result?p=@ant-design/cli)\n[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](./LICENSE)\n\n[English](./README.md) · [中文](./README.zh-CN.md) · [Changelog](./CHANGELOG.md)\n\n
\n\n
\n\n## 🤔 Why\n\nCode agents (Claude Code, Codex, Gemini CLI) write better antd code when they have instant access to the right API data. This CLI gives them exactly that — **every prop, token, demo, and changelog entry for antd v3 / v4 / v5 / v6**, bundled locally, queryable in milliseconds.\n\n```bash\nnpx skills add ant-design/ant-design-cli # install as an agent skill\n```\n\n
\n\n## ✨ Highlights\n\n- 📦 **Fully offline** — All metadata ships with the package. No network calls, no latency, no API keys.\n- 🎯 **Version-accurate** — 55+ per-minor snapshots across v3/v4/v5/v6. Query the exact API surface of `antd@5.3.0`, not just \"latest v5\".\n- 🤖 **Agent-optimized** — `--format json` on every command. Structured errors with codes and suggestions. Clean stdout/stderr separation.\n- 🌍 **Bilingual** — Every component name, description, and doc has both English and Chinese. Switch with `--lang zh`.\n- 🔮 **Smart matching** — Typo `Buttn`? The CLI suggests `Button` using Levenshtein distance, with first-letter preference.\n- 🧩 **18 commands** — From prop lookup to project-wide lint, from design token queries to cross-version API diffing.\n- 🔌 **MCP server** — `antd mcp` starts a stdio server for native IDE integration (Claude Code, Cursor, VS Code, etc.).\n\n
\n\n## 📦 Install\n\n```bash\nnpm install -g @ant-design/cli\n```\n\n
\nOther package managers\n\n```bash\npnpm add -g @ant-design/cli\nbun add -g @ant-design/cli\n```\n\n
\n\n
\n\n## 🤖 Agent Integration\n\nThe CLI ships with a [skill file](./skills/antd/SKILL.md) that teaches code agents *when* and *how* to use each command:\n\n```bash\nnpx skills add ant-design/ant-design-cli\n```\n\nOr simply tell your code agent:\n\n> Install `@ant-design/cli` and the antd skill from `ant-design/ant-design-cli`\n\nThe agent will handle `npm install`, `npx skills add`, and start using the CLI automatically.\n\nWorks with [Claude Code](https://claude.ai/code), [Cursor](https://cursor.sh), [Codex](https://openai.com/codex), [Gemini CLI](https://github.com/google-gemini/gemini-cli), and any agent supporting the [skills](https://github.com/nicepkg/agent-skills) protocol.\n\n### MCP Server\n\nFor IDEs that support [Model Context Protocol](https://modelcontextprotocol.io), the CLI can run as an MCP server:\n\n```json\n{\n \"mcpServers\": {\n \"antd\": {\n \"command\": \"npx\",\n \"args\": [\"-y\", \"@ant-design/cli\", \"mcp\"]\n }\n }\n}\n```\n\nOr if you have the CLI installed globally (`npm i -g @ant-design/cli`):\n\n```json\n{\n \"mcpServers\": {\n \"antd\": {\n \"command\": \"antd\",\n \"args\": [\"mcp\"]\n }\n }\n}\n```\n\nTo pin a specific antd version, add `\"--version\", \"5.20.0\"` to the `args` array.\n\nThis exposes 8 tools (`antd_list`, `antd_info`, `antd_doc`, `antd_demo`, `antd_token`, `antd_design_md`, `antd_semantic`, `antd_changelog`) and 2 prompts (`antd-expert`, `antd-page-generator`) for native IDE integration.\n\n
\n\n## 🚀 Quick Start\n\n```bash\nantd list # All components with versions\nantd info Button # Component props, types, defaults\nantd doc Button # Full markdown documentation\nantd demo Select basic # Runnable demo source code\nantd token DatePicker # Design Token values (v5+)\nantd design.md # Design-language document (design.md)\nantd semantic Table # classNames / styles structure\nantd changelog 4.24.0 5.0.0 Select # API diff across versions\nantd doctor # Diagnose project issues\nantd env # Collect env info for bug reports\nantd usage ./src # Analyze antd imports in project\nantd lint ./src # Check deprecated APIs & best practices\nantd migrate 3 4 # v3 → v4 migration guide\nantd migrate 4 5 --apply ./src # Agent-ready migration prompt\nantd mcp # Start MCP server for IDE integration\nantd setup --client claude # Set up MCP/Skill for AI agents\nantd upgrade # Upgrade CLI to latest version\n```\n\n
\n\n## 📖 Commands\n\n### 📚 Knowledge Query\n\n| Command | Description |\n|---|---|\n| [`antd list`](#antd-list) | List all components with bilingual names, categories, and `since` versions |\n| [`antd info `](#antd-info-component) | Props table with types, defaults, `since`, and deprecated status |\n| [`antd doc `](#antd-doc-component) | Full markdown documentation for a component |\n| [`antd demo [name]`](#antd-demo-component-name) | Runnable demo source code (TSX) |\n| [`antd token [Component]`](#antd-token-component) | Global or component-level Design Tokens |\n| [`antd design.md`](#antd-designmd) | Design-language document (`design.md`) for AI design tools |\n| [`antd semantic `](#antd-semantic-component) | Semantic `classNames` / `styles` structure with usage examples |\n| [`antd changelog`](#antd-changelog-v1-v2-component) | Changelog entries, version ranges, or cross-version API diff |\n\n### 🔍 Project Analysis\n\n| Command | Description |\n|---|---|\n| [`antd doctor`](#antd-doctor) | 10 diagnostic checks: React compat, duplicates, peer deps, SSR, babel plugins |\n| [`antd env [dir]`](#antd-env-dir) | Collect all antd-related environment info for bug reporting or AI diagnosis |\n| [`antd usage [dir]`](#antd-usage-dir) | Import stats, sub-component breakdown (`Form.Item`), non-component exports |\n| [`antd lint [target]`](#antd-lint-target) | Deprecated APIs, accessibility gaps, performance issues, best practices |\n| [`antd migrate `](#antd-migrate-from-to) | Migration checklist with auto-fixable/manual split and `--apply` agent prompt |\n\n### 🐛 Issue Reporting\n\n| Command | Description |\n|---|---|\n| [`antd bug`](#antd-bug) | File a bug to ant-design/ant-design with auto-collected environment info |\n| [`antd bug-cli`](#antd-bug-cli) | File a bug to ant-design/ant-design-cli |\n\n### 🔧 CLI Management\n\n| Command | Description |\n|---|---|\n| [`antd mcp`](#antd-mcp) | Start MCP stdio server for IDE agent integration |\n| [`antd setup`](#antd-setup) | Write local MCP config or install skills for Claude Code, Cursor, VS Code, or Codex |\n| [`antd upgrade`](#antd-upgrade) | Upgrade the CLI to the latest version |\n\n
\n\n---\n\n### `antd list`\n\n```bash\nantd list # all components\nantd list --version 5.0.0 # components available in v5.0.0\n```\n\n
\nExample output\n\n```\nComponent 组件名 Description Since\n-------------- ------- ------------------------------------------------------- ------\nButton 按钮 To trigger an operation. 4.0.0\nTable 表格 A table displays rows of data. 4.0.0\nForm 表单 High performance Form component with data scope management. 4.0.0\nSelect 选择器 Select component to select value from options. 4.0.0\nModal 对话框 Modal dialogs. 4.0.0\nColorPicker 颜色选择器 Used for color selection. 5.5.0\n...\n```\n\n
\n\n### `antd info `\n\n```bash\nantd info Button # props table\nantd info Button --detail # + descriptions, since, deprecated, FAQ\nantd info Button --version 4.24.0 # v4 API snapshot\n```\n\n
\nExample output\n\n```\nButton (按钮) — To trigger an operation.\n\nProperty Type Default Since\n--------------- -------------------------------------------- -------- ------\nautoInsertSpace boolean true 5.17.0\nblock boolean false -\nclassNames Record - 5.4.0\ndisabled boolean false -\nhref string - -\nicon ReactNode - -\nloading boolean | { delay: number, icon: ReactNode } false -\nsize large | middle | small middle -\ntype primary | default | dashed | text | link default -\nvariant outlined | dashed | solid | filled | text - 5.13.0\nonClick (event: React.MouseEvent) => void - -\n```\n\n
\n\n### `antd doc `\n\n```bash\nantd doc Button # full markdown docs to stdout\nantd doc Button --format json # { name, doc }\nantd doc Button --lang zh # Chinese documentation\n```\n\n### `antd demo [name]`\n\n```bash\nantd demo Button # list all available demos\nantd demo Button basic # get demo source code\n```\n\n### `antd token [Component]`\n\n```bash\nantd token # global tokens (colorPrimary, borderRadius, ...)\nantd token Button # component-level tokens\n```\n\n### `antd design.md`\n\nOutput the antd **design-language document** (`design.md`) — a curated description of antd's default light theme, conformant with the [google-labs-code/design.md](https://github.com/google-labs-code/design.md) spec. Where `antd token` lists individual token names, `antd design.md` describes the design language as a whole (color/typography/spacing/radius values plus the principles behind them), so AI design tools (Figma Make, Stitch, etc.) and agents can consume antd's design language directly.\n\n```bash\nantd design.md # design.md for the detected version\nantd design.md --version 6.4.0 # design.md for a specific version\nantd design.md --format json # { doc }\n```\n\n`design.md` is **major-grained** (antd rewrites it only across major releases), so it is resolved by major version. A `design.md` is currently published only for **antd v6** — requesting a major without one (v3/v4/v5) returns `UNSUPPORTED_VERSION_FEATURE`. It mirrors the canonical `DESIGN.md` published at [`https://ant.design/design.md`](https://ant.design/design.md).\n\n### `antd semantic `\n\n```bash\nantd semantic Table\n```\n\n
\nExample output\n\n```\nTable Semantic Structure:\n├── header # Table header area\n├── body # Table body area\n├── footer # Table footer area\n├── cell # Table cell\n├── row # Table row\n└── wrapper # Outer wrapper\n\nUsage:\n \n
\n```\n\n\n\n### `antd changelog [v1] [v2] [component]`\n\n```bash\nantd changelog 5.22.0 # single version\nantd changelog 5.21.0..5.24.0 # version range (inclusive)\nantd changelog 4.24.0 5.0.0 # API diff between two versions\nantd changelog 4.24.0 5.0.0 Select # API diff for Select only\n```\n\n---\n\n### `antd doctor`\n\nRuns 10 checks against your project: antd installed and bundled known-bug version data, React version compat, duplicate antd/dayjs/cssinjs installs, peer dependency satisfaction, theme config, babel-plugin-import usage, and CSS-in-JS setup. All checks use bundled/local data and do not make network calls.\n\n```bash\nantd doctor\nantd doctor --format json\n```\n\n### `antd env [dir]`\n\nCollect all antd-related environment information — system, Node, package managers, browsers, dependencies, ecosystem packages (`@ant-design/*`, `rc-*`), and build tools — in one shot.\n\n```bash\nantd env # text output (paste into GitHub Issues)\nantd env --format json # structured JSON for AI consumption\nantd env --format markdown # markdown tables\nantd env ./my-project # scan a specific project directory\n```\n\n
\nExample output\n\n```text\nEnvironment\n\n System:\n OS macOS 15.3\n\n Binaries:\n Node 20.11.0\n pnpm 9.1.0\n Registry https://registry.npmmirror.com/\n\n Browsers:\n Chrome 131.0.6778.86\n Safari 18.3\n\n Dependencies:\n antd 5.22.0\n react 18.3.1\n react-dom 18.3.1\n dayjs 1.11.13\n @ant-design/cssinjs 1.22.1\n @ant-design/icons 5.5.2\n\n Ecosystem:\n @ant-design/pro-components 2.8.1\n rc-field-form 2.7.0\n\n Build Tools:\n umi 4.3.0\n typescript 5.6.3\n less 4.2.0\n```\n\n
\n\n### `antd usage [dir]`\n\n```bash\nantd usage # scan current directory\nantd usage ./src # scan specific directory\nantd usage -f Button # filter to one component\n```\n\n### `antd lint [target]`\n\nFour rule categories: `deprecated`, `a11y`, `usage`, `performance`. Deprecation rules are derived from metadata at runtime, so they're always version-accurate.\n\n```bash\nantd lint ./src\nantd lint ./src --only deprecated\nantd lint ./src --only a11y\nantd lint ./src --only usage\nantd lint ./src --diff # check changed files only\nantd lint --staged # check staged files only\nantd lint ./src --only deprecated --format json --antd-alias @shared-components\n```\n\n`usage` checks include antd-specific prop/API mistakes such as Form.Item conflicts, Upload controlled value conflicts, static feedback APIs that should use `App.useApp()` in v5+, and v5+ Select children APIs that should use `options`.\n\nUse `--antd-alias ` to treat additional package names as aliases of `antd`. Repeat the flag for multiple wrapper packages; `antd` remains enabled by default.\n\nUse `--diff [base]` to lint changed git files only. By default it compares with `origin/main`'s merge-base, falling back to `HEAD`; pass a base ref such as `main` to override it. Use `--staged` to lint only staged files.\n\nFiles that cannot be read or parsed are reported as skipped instead of being silently ignored. JSON output includes `skippedFiles`, `partial`, and `summary.skipped`; text and markdown output include a skipped-files section.\n\n### `antd migrate `\n\nv3→v4 covers 15+ migration steps; v4→v5 covers 25+ migration steps; v5→v6 covers 30+. Each step includes component name, breaking flag, search pattern, and before/after code.\n\n```bash\nantd migrate 3 4 # v3 → v4 migration\nantd migrate 4 5 # full checklist\nantd migrate 4 5 --component Select # component-specific\nantd migrate 4 5 --apply ./src # generate agent migration prompt\n```\n\n
\nExample output\n\n```\nMigration Guide: v4 → v5\n\n Select:\n 🔧 [BREAKING] Prop `dropdownClassName` renamed to `popupClassName`\n 🔧 [BREAKING] Prop `dropdownMatchSelectWidth` renamed to `popupMatchSelectWidth`\n\nTotal: 2 steps (2 auto-fixable, 0 manual)\n```\n\n
\n\n### `antd bug`\n\n```bash\nantd bug --title \"DatePicker crashes with dayjs 2.0\"\nantd bug --title \"...\" --steps \"1. Click\" --expected \"Works\" --actual \"Crashes\"\nantd bug --title \"...\" --submit # submit via gh CLI\n```\n\n### `antd bug-cli`\n\n```bash\nantd bug-cli --title \"info command crashes on v4\"\nantd bug-cli --title \"...\" --submit\n```\n\n### `antd mcp`\n\nStart an MCP (Model Context Protocol) stdio server for IDE agent integration. Exposes 8 tools and 2 prompts for native IDE integration (Claude Code, Cursor, VS Code, Codex, etc.).\n\n```bash\nantd mcp # start with auto-detected version\nantd mcp --version 5.20.0 --lang zh # pin version and language\n```\n\nConfiguration:\n\n```json\n{\n \"mcpServers\": {\n \"antd\": {\n \"command\": \"npx\",\n \"args\": [\"-y\", \"@ant-design/cli\", \"mcp\"]\n }\n }\n}\n```\n\n**MCP Tools (8):** `antd_list`, `antd_info`, `antd_doc`, `antd_demo`, `antd_token`, `antd_design_md`, `antd_semantic`, `antd_changelog`\n\n**MCP Prompts (2):** `antd-expert`, `antd-page-generator`\n\n### `antd setup`\n\nConfigure a local AI agent project with Ant Design MCP and/or the bundled `skills/antd` guidance. The command can write the client-specific MCP config file, install a client-appropriate skill or skill reference, and add managed instructions for agents.\n\n```bash\nantd setup --client claude # write .mcp.json\nantd setup --client cursor # write .cursor/mcp.json\nantd setup --client vscode # write .vscode/mcp.json\nantd setup --client codex # install Codex project skill\nantd setup --client github-actions # write .github/workflows/antd-cli.yml\nantd setup --client claude --dry-run # preview without writing files\nantd setup --client claude --project ./my-app\nantd setup --client claude --version 5.29.3 --lang zh\nantd setup --client claude --check # verify existing config\nantd setup --client claude --mode skill # install Claude skill and write instructions\nantd setup --client claude --mode both # write MCP config, install skill, and write instructions\nantd setup --client claude --write-instructions\n```\n\nModes:\n\n| Mode | Behavior |\n|---|---|\n| `mcp` | Writes the client MCP config only. This is the default. |\n| `skill` | Installs the bundled Ant Design guidance for the selected client and writes a managed instruction block. |\n| `both` | Writes MCP config, installs the skill or skill reference, and writes the managed instruction block. |\n| `ci` | Writes a GitHub Actions workflow. This mode is only supported by `--client github-actions`. |\n\nSupported clients:\n\n| Client | Config file | Server key | Skill target | Instructions file |\n|---|---|---|---|---|\n| `claude` | `.mcp.json` | `mcpServers` | `.claude/skills/antd/` | `CLAUDE.md` |\n| `cursor` | `.cursor/mcp.json` | `mcpServers` | `.agents/skills/antd/` shared skill | `AGENTS.md` |\n| `vscode` | `.vscode/mcp.json` | `servers` | `.agents/skills/antd/` shared skill | `AGENTS.md` |\n| `codex` | - | - | `.agents/skills/antd/` shared skill | `AGENTS.md` |\n| `github-actions` | `.github/workflows/antd-cli.yml` | - | - | - |\n\nGenerated server entry:\n\n```json\n{\n \"mcpServers\": {\n \"antd\": {\n \"command\": \"npx\",\n \"args\": [\"-y\", \"@ant-design/cli\", \"mcp\", \"--version\", \"5.29.3\", \"--lang\", \"zh\"]\n }\n }\n}\n```\n\nSkill instructions are written to the selected client's instruction file: Claude uses `CLAUDE.md`; Cursor, VS Code, and Codex use `AGENTS.md`. Claude gets a native project skill under `.claude/skills/antd/`; Cursor, VS Code, and Codex get the same bundled guidance under `.agents/skills/antd/` and an instruction block telling agents when to use it.\n\nCodex setup currently supports skill installation only. Use `antd setup --client codex --mode skill`, or omit `--mode` because Codex defaults to `skill`.\n\nGitHub Actions setup writes an advisory pull-request workflow that runs `npm ci`, `npm run build`, `npx -y @ant-design/cli doctor --format json`, and `npx -y @ant-design/cli lint ./src --format json`. Use `--check` to verify that the workflow matches the generated content.\n\nUse `--check` to validate an existing setup without writing files. It exits with code `0` when the selected mode is configured, and `1` when config, skill files, or instructions are missing or different.\n\nUse `--write-instructions` with the default `mcp` mode to also add an idempotent managed block to the selected agent instructions file, telling agents to use the configured `antd` MCP server before generating Ant Design code. With `--check`, it also verifies that instruction block.\n\n### `antd upgrade`\n\nUpgrade the CLI itself to the latest version published on npm. Automatically detects which package manager installed the CLI (npm, yarn, pnpm, bun, cnpm, utoo) and runs the corresponding upgrade command.\n\n```bash\nantd upgrade # upgrade to latest version\n```\n\n
\nExample output\n\n```text\nUpgrading @ant-design/cli: v6.4.3 → v6.4.4\nRunning: npm install -g @ant-design/cli@latest\n... (passthrough package manager output) ...\nSuccessfully upgraded to v6.4.4\n```\n\n
\n\n
\n\n## ⚙️ Global Flags\n\n| Flag | Description | Default |\n|---|---|---|\n| `--format json\\|text\\|markdown` | Output format | `text` |\n| `--version ` | Target antd version (e.g. `5.20.0`) | auto-detect |\n| `--lang en\\|zh` | Output language | `en` |\n| `--detail` | Include extended information | `false` |\n| `-V, --cli-version` | Print CLI version | — |\n\n**Version auto-detection**: `--version` flag → `node_modules/antd` → `package.json` dependencies → fallback `5.24.0`\n\n### Environment Variables\n\n| Variable | Description |\n|---|---|\n| `ANTD_NO_AUTO_REPORT=1` | Disable bug-reporting suggestions from AI agents (see [#82](https://github.com/ant-design/ant-design-cli/issues/82)) |\n| `NO_UPDATE_CHECK=1` | Skip the silent version update check |\n| `CI=1` | Skip the silent version update check (same as `NO_UPDATE_CHECK=1`) |\n\n
\n\n## 📄 License\n\n[MIT](./LICENSE) © [Ant Design](https://ant.design)\n", "bytes": 22009, "sha": "f8c94205c9d04502f0197842f175e96036be7090a116e767466b9fa1183c37d0", "repo_slug": "ant-design/ant-design-cli", "fonte": "repo", "truncated": false, "api": "https://agentalog.com/api/listings/skl_ant_design_ant_design_cli_antd_5f4bbef0/readme" }