# Ant Design Pro: a template with 20 blocks, a one way simplify script, and two agent skills

> Ant Design Pro is a React boilerplate for enterprise applications, cloned as a template rather than installed as a package, with 20 page blocks, mock data, and an AI Assistant page. Two of its scripts decide the shape of your app before you write a line of code: npm run simple deletes blocks irreversibly, and the shipped Claude Code skills try to merge future template upgrades for you.

**ant-design/ant-design-pro** — GitHub describes it as 👨🏻‍💻👩🏻‍💻 Use Ant Design like a Pro!. The repository metadata lists TypeScript as its primary language. The metadata lists the MIT license. This article stays within the project description and details documented in the GitHub repository README.

- Repository: https://github.com/ant-design/ant-design-pro
- Website: https://pro.ant.design
- Stars: 38,821 · Forks: 8,254
- Language: TypeScript
- License: MIT
- Published: 2026-08-13 · Updated: 2026-08-18 · Language: en
- Canonical page: https://hysenlabs.com/projects/ant-design-ant-design-pro

## `npm run simple` deletes blocks and cannot be undone

The template ships every block at once, and the escape hatch is destructive. Four things happen when you run it: extra page directories are removed, covering dashboard, form, list/*, profile, result, exception, and account among others; extra mock files are removed; routes are replaced with the simple version; and extra dependencies are stripped out of package.json. The documentation states in one line that the operation is irreversible and will permanently delete files.

The consequence is that this is a decision about your repository, not about your editor, and it rewrites your dependency list and route table as a side effect of deleting directories. The prescribed install makes it worse:

```bash
git clone --depth=1 https://github.com/ant-design/ant-design-pro.git myapp
cd myapp
```

A depth 1 clone has exactly one commit in its history, so the delete is recoverable through git restore but not comparable against any earlier state of the template, and git log will not tell you what changed. Anyone planning to use the upgrade skill later wants a full history, and the documented command is the shallow one.

## Six start scripts differ by an environment variable and a mock flag

The package scripts show how the same dev server is retargeted. start runs cross-env UMI_ENV=dev max dev, dev runs cross-env UMI_ENV=dev MOCK=none max dev, start:no-mock runs cross-env MOCK=none max dev, start:pre runs cross-env UMI_ENV=pre MOCK=none max dev, and start:test runs cross-env UMI_ENV=test MOCK=none max dev. The documented entry point is the plain one:

```bash
npm start
```

The build side has the same shape. build runs max build, analyze adds ANALYZE=1 in front of it, deploy runs a CI build and then gh-pages -d dist, preview serves the built output on port 8000, and record runs max record with the login scene.

The consequence is that MOCK=none is the switch between a dev server backed by the mock files in the mock directory and one that calls your real endpoints, and nothing in the usage section mentions it, so the default start is a mock backed environment. Two further scripts sit outside the documented flow: openapi runs max openapi, and i18n-remove deletes translation entries, which is a second irreversible operation with no warning attached.

## The default clone is twenty pages of someone else's admin panel

The template list is the clearest statement of what you inherit. It is a Welcome page, a Dashboard with Analysis, Monitor, and Workplace, three Form pages, four List pages, two Profile pages, two Result pages, three Exception pages for 403, 404, and 500, two Account pages, three User pages for Login, Register, and Register Result, plus an AI Assistant page powered by Ant Design X.

Each of those is a working route with its own API call, and the feature list adds the supporting machinery: mock development as a first class solution, unit and end to end tests, built in internationalisation, and theming through Tailwind CSS v4 with antd-style.

The consequence is that a fresh clone is a demo application, and the README's own answer to that is to delete most of it. The alternative is shipping twenty pages of placeholder content with your own product name in the header, which is a much more expensive mistake to walk back than running one script on day one. The mock data is the sharper edge, because a route that looks finished but reads from mock files will pass a manual click test and fail the first time it meets a real backend.

## Two agent skills ship inside the clone and drift with it

The repository carries agent facing files at the root: a .claude directory, a .agents directory, AGENTS.md, and CLAUDE.md. Inside .claude/skills/ there are two Claude Code skills. /pro-upgrade fires on phrases like upgrade pro or update to latest and is described as diffing the latest template and merging framework changes while preserving your business code. /antd fires on antd related code or questions and queries component APIs, props, tokens, and demos, lints for deprecated usage, and migrates between versions, all through @ant-design/cli. The documented invocations are:

```bash
# Upgrade the project to latest Pro version
/pro-upgrade

# Query antd component info, debug issues, run lint, etc.
/antd
```

The consequence is that the skills are as old as the template you cloned, and the fix offered is to pull updates from the template or run npx skills add ant-design/ant-design-pro. A merge performed by an agent across a whole template is also where your breakage lands, and a shallow clone gives it no history to reason about.

## The browser support table leaves Safari without a window

The support statement is two words, Modern browsers, followed by a table with four browser columns. The single data row has three values: Edge, Firefox, and Chrome at last 2 versions each. The Safari column is present and empty, so the table declares no support window for Safari at all. The only machine readable policy in the project is the browserslist field in package.json, which is the single entry defaults.

The consequence is that the published policy covers three engines and leaves the fourth unstated, and defaults is a query string rather than a floor you can point a user at. If your users are on Safari and you need to state a minimum version in your own documentation, nothing in this repository gives you one, and the same applies to any engine not in the table, including the mobile browsers the template claims to serve through its responsive design. It is a small gap, and it is the kind of gap that gets discovered during an incident rather than during setup, because every other part of the template is explicit about what it assumes.

## `npm run lint` is two commands and it never runs the tests

Linting is Biome plus the type checker. The lint script runs npm run biome:lint && npm run tsc, which resolves to biome lint and tsc --noEmit, and there is a separate biome script that runs biome check --write, which rewrites files rather than reporting on them. Tests are a different tool entirely: vitest run for a single pass, vitest run --coverage, vitest for watch mode, and vitest --ui. A separate doctor script runs react-doctor, and coverage is wired through a codecov.yml at the root.

The gate on commits sits elsewhere again, in .husky, .lintstagedrc, and .commitlintrc.js.

The consequence is that three different checks exist and none of them runs the others. npm run lint will not fail on a failing test, the test script will not fail on a lint error, and biome check --write mutates your source when you meant to inspect it. The install step also has its own hook, because npm runs the prepare script on install, and that script runs npx husky and max setup, so a fresh npm install touches git hooks and the build tooling before you run a single command of your own.

## The documentation is one cheatsheet file and the preview is elsewhere

Everything the project offers as documentation lives in a single file, docs/cheatsheet.en-US.md, and the FAQ is an anchor inside that same file rather than a separate document. The change log is not in the repository at all: it points at the GitHub releases page. The preview is a deployed instance at preview.pro.ant.design, and the homepage is pro.ant.design. The only translation in the tree is README.zh-CN.md, with the English README as the default.

The rest of the root tells you what kind of project this is. config/ holds the build configuration consumed by Umi Max, mock/ holds the mock endpoints, public/ the static assets, src/ the application, tests/ the test suites, and types/ the type declarations. Alongside them sit the tool configuration files, biome.json, tailwind.config.js, tailwind.css, tsconfig.json, vitest.config.ts, and doctor.config.json, plus a cloudflare-worker directory, a package-lock.json, and an .npmrc.

The consequence is that a reader who wants to know how a component should be used is pointed at a cheatsheet inside the template rather than at versioned API documentation, and the answers are tied to the generation you cloned. It also means the configuration you will need to understand first, the routing and the build, lives in a config directory whose contents are not described anywhere in the repository.

## MIT licensed, private package, and a version that tracks the release tag

The licensing is MIT, which is why the cost question has a short answer: the template itself carries no licence fee, and the package is marked private in package.json, so it is a repository to clone rather than a package to install. The usage section says exactly that, clone or download to your local machine, followed by npm install. The stack it pins is React 19, Umi Max 4, antd 6, utoopack, Biome, Vitest, and Tailwind CSS v4 with antd-style, and the component library itself arrives as a dependency at @ant-design/pro-components, so install ant design pro components means depending on that package, not this repository.

The version field in package.json reads 6.0.3, and the newest release is v6.0.3 dated 2026-08-17, with v6.0.2 from 2026-05-28 and v6.0.1 from 2026-05-06 before it. The repository is not archived and was last pushed on 2026-09-21.

The consequence is that the template's own version marker is the release tag, so you can tell exactly which generation you cloned, and a project six months past that tag is six months past the fixes that followed. The Vue question that gets searched has no answer here at all: every script, dependency, and tool in this repository is React.

## Conclusion

Ant Design Pro fits a team that wants an admin panel shape on day one and accepts Umi Max, Biome, and Vitest as the toolchain, especially one already on antd 6. It does not fit a team that wants a component library it can install by version, since the package is marked private and the path is a clone, nor a team that needs a clean starting point without spending an afternoon deleting demo pages. Before you commit, run npm run simple rather than shipping the template's own pages, read the browser support table yourself because it leaves Safari without a stated window, and keep a full history clone rather than the documented depth 1 one so a future template upgrade has something to diff against.

## FAQ

### What is Ant Design Pro?

It is an out of box UI solution for enterprise applications delivered as a React boilerplate, built on the Ant Design 6 specification with React 19, Umi Max 4, utoopack, Biome, and Vitest. You clone it with git clone --depth=1 and then run npm install and npm start, and the package itself is marked private in package.json.

### How much does Ant Design cost?

The template repository is MIT licensed and package.json marks it private, so there is no licence fee for the boilerplate itself. The README in this repository states no price for anything, and the paid offerings of the wider Ant Design ecosystem are not covered by this file.

### is ant design pro free

The repository carries an MIT LICENSE file at its root, and the package is marked private, so the template is free to use and modify. What you install on top of it is a dependency list, including @ant-design/pro-components at ^3.1.14-2 and antd at ^6.6.0.

### install ant design pro components

The Pro components come in as a dependency of the template, @ant-design/pro-components at ^3.1.14-2, so installing them means installing the project. The documented path is git clone --depth=1 https://github.com/ant-design/ant-design-pro.git myapp, then cd myapp, then npm install. This repository is React only and documents no Vue path.

### ant design pro alternative

The README names no alternative and no comparison. What it does name is its own stack: React 19, Umi Max 4, antd 6, utoopack, Biome, Vitest, and theming through Tailwind CSS v4 with antd-style, so a swap means replacing that chain rather than one component library.

## Sources

- [Official documentation](https://pro.ant.design)
- [Official README](https://github.com/ant-design/ant-design-pro#readme)
- [Project repository](https://github.com/ant-design/ant-design-pro)
- [Release notes](https://github.com/ant-design/ant-design-pro/releases)

---

Hysen Labs editorial analysis, written from the project's own repository and release notes. Cite the canonical page: https://hysenlabs.com/projects/ant-design-ant-design-pro