ant-design-pro
Installation
SKILL.md
Ant Design Pro
S - Scope
- Target: ant-design-pro@^5 and @ant-design/pro-components on top of antd@^6.
- Cover: layout shell, routing/menu, access control, CRUD standardization with ProTable/ProForm.
- Avoid: low-level antd component styling and token details (use ant-design skill).
- Avoid: AI chat/copilot UI (use ant-design-x skill).
Reference index (Chinese)
| Topic | Description | Reference |
|---|---|---|
| Core v5 | Version scope and baseline guidance | references/pro-v5.md |
| Layout advanced | Layouts, menus, access, multi-layout patterns | references/pro-layout-advanced.md |
| ProTable advanced | Query/table coupling, request patterns, perf | references/protable-advanced.md |
| ProForm advanced | Step forms, dynamic fields, table linkage | references/proform-advanced.md |
P - Process
- Identify business context: roles/RBAC, page types, data sources, multi-tenant needs.
- Define structure: layouts/, pages/, services/, access.ts; keep routes as the menu source of truth.
- Design routing and permissions: page-level access first; UI hides, backend enforces.
- Standardize CRUD: ProTable for list/search/action patterns; ProForm for form state/validation.
- Centralize data access: keep network calls in services; pages adapt data shape only.
- Use the
Referenceindex when the scenario is beyond the common path.
O - Output
- Provide route/layout plan and access model (roles, rules, page gates).
- Provide ProTable/ProForm schemas or column/field definitions as the source of truth.
- Call out anti-patterns (ad-hoc layouts, in-page fetch, inconsistent tables) and fixes.
- Include testing checkpoints for permissions, menu visibility, and CRUD workflows.
Related skills
More from ant-design/antd-skill
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.
1.7Kantd
>
274ant-design-x
Ant Design X 2.x guidance for AI chat/copilot UI, streaming message state, tool rendering, and X Markdown on top of antd. Use when building AI conversations, agent tools UI, or streaming LLM experiences with @ant-design/x.
3