Ant Design Pro is a production-ready solution for admin interfaces. Built on the design principles developed by Ant Design, this project introduces higher level components; we have developed templates, components, and a corresponding design kit to improve the user and development experience for admin interfaces.

Tips before development

Ant Design Pro is a front-end scaffolding. By default, readers have already understood some basic front-end knowledge, and understand umi and Ant Design. If you are a pure novice, it is recommended to read Beginner's Need to know. Sharpen the knife and chop wood by mistake. Knowing some basic knowledge can make the learning curve smoother.

Init

We provide create umi to quickly initialize scaffolding.

# use by npm
npx create-umi myapp
# use by yarn
yarn create umi myapp

Create umi offers a wide range of options to meet the scaffolding needs of different users, and we can choose to develop the language JavaScript or TypeScript.

You can also choose whether to get all the chunks.

Select the version of antd, 3 or 4.

A successful scaffold log.

Development

The development can begin after the initialization of the scaffolding is successful, and we have provided some commands to assist in the development.

cd myapp && npm install

Run this first to install/update any required dependencies.

start

Running this script starts the service and automatically opens the default browser to show your page. When you re-edit the code, the page will also refresh automatically.

build

Running this script will compile your project, and you can find the compiled files in the dist directory of the project for deployment.

If you need to deploy, you can review the [deployment]((/docs/deploy).

analyze

The analyze script does the same thing as build, but he opens a page showing your dependency information. If you need to optimize performance and package size, you need it.

lint

We offer a range of lint scripts, including TypeScript, less, css, md files. You can use this script to see what problems your code has. In commit we automatically run the related lint.

lint:fix

Same as lint, but the lint error is fixed automatically.

i18n-remove

This script will attempt to remove all i18n code from the project, which is not good for complex run-time code and is used with caution.

more cli https://umijs.org/docs/cli