还在一遍遍查文档?还在为版本迁移头疼?这把 CLI 神器让你效率翻倍!


一句话介绍

@ant-design/cli 是 Ant Design 官方出品的命令行工具,专为开发者和 AI Agent 设计,提供组件知识查询、项目诊断、版本迁移等能力,完全离线可用


为什么需要它?

作为 Ant Design 用户,你是否遇到过这些痛点:

  • 😩 记不住组件有哪些 Props,翻文档太麻烦
  • 😰 升级 Ant Design 版本,不知道哪些 API 废弃了
  • 😫 项目里用了哪些组件心里没底
  • 😅 想给 AI Agent 描述 Ant Design 组件,但不知道怎么说

@ant-design/cli 就是来解决这些问题的!


核心功能一览

📚 知识查询 — 像翻字典一样快

命令 作用 示例
antd info Button 查看组件属性、类型、默认值 antd info Select
antd doc Button 获取完整 Markdown 文档 antd doc Modal
antd demo Button 获取可运行的示例代码 antd demo Form basic
antd token Button 查询设计令牌值 antd token DatePicker
antd semantic Button 查看语义化 class 结构 antd semantic Table
antd changelog 版本更新日志 / API 差异对比 antd changelog 4.24.0 5.0.0
antd list 列出所有组件 antd list

🔍 项目分析 — 你的代码体检报告

命令 作用 示例
antd doctor 10 项诊断检查 antd doctor
antd usage ./src 分析组件使用情况 antd usage ./src
antd lint ./src 检查废弃 API、无障碍问题 antd lint ./src
antd migrate 4 5 生成版本迁移指南 antd migrate 4 5 --apply ./src

🐛 问题报告 — 一键收集环境信息

命令 作用
antd bug 提交 ant-design 问题
antd bug-cli 提交 CLI 本身问题

安装 — 30 秒上手

# npm
npm install -g @ant-design/cli

# pnpm
pnpm add -g @ant-design/cli

# bun
bun add -g @ant-design/cli

安装完成后,直接在终端输入 antd 即可使用!


实用场景

场景 1:快速查询组件用法

# 想查看 Button 组件有哪些属性?
antd info Button

# 想看 Select 组件的基础示例?
antd demo Select basic

# 想了解 Table 的设计令牌?
antd token Table

场景 2:版本升级不用慌

# 查看 v4 到 v5 的迁移差异
antd changelog 4.24.0 5.0.0 Select

# 自动应用迁移修复
antd migrate 4 5 --apply ./src

场景 3:项目体检

# 诊断项目问题(React兼容性、依赖问题等)
antd doctor

# 统计项目中各组件的使用频率
antd usage ./src

# 检查废弃 API 和无障碍问题
antd lint ./src

三大亮点

✨ 完全离线

所有组件元数据都随包分发,不需要网络连接,随时可用。

✨ 智能匹配

输入拼写错误?自动纠错!

输入: antd info Buttn
提示: 你是不是想输入 Button?
输出: Button 组件信息

🤖 Skills 快速集成

只需一行命令,即可把 ant-design-cli 的能力接入你的 AI Agent:

npx skills add ant-design/ant-design-cli

支持的 AI Agent:

  • Claude Code
  • Cursor
  • Codex
  • Gemini CLI

✨ AI Agent 原生支持

支持 MCP 协议,可集成到各种 AI 编码助手:

{
  "mcpServers": {
    "antd": {
      "command": "antd",
      "args": ["mcp"]
    }
  }
}

支持的 Agent:

  • Claude Code
  • Cursor
  • Codex
  • Gemini CLI

全局参数

参数 说明 默认值
--format 输出格式 (json/text/markdown) text
--version 指定 Ant Design 版本 自动检测
--lang 语言 (en/zh) en
--detail 显示扩展信息 false

小试牛刀

# 第一步:安装
npm install -g @ant-design/cli

# 第二步:试试这些命令
antd list
antd info Button
antd demo Select basic
antd token DatePicker

📦 信息

  • 版本: v6.3.5-beta.0
  • 许可证: MIT
  • 仓库: github.com/ant-design/ant-design-cli

让 Ant Design 开发更简单,从命令行开始。

Logo

小龙虾开发者社区是 CSDN 旗下专注 OpenClaw 生态的官方阵地,聚焦技能开发、插件实践与部署教程,为开发者提供可直接落地的方案、工具与交流平台,助力高效构建与落地 AI 应用

更多推荐