ant design pro 提供了 pro-cli 快速初始化的脚手架

# Node 安装

# npm 安装

1
2
3

# 使用 npm
npm i @ant-design/pro-cli -g
pro create myapp

# yarn 安装

1
2
3

# 使用 yarn
yarn add global @ant-desgin/pro-cli
pro create myapp

# pnpm 安装

1
2
3

# 使用 pnpm
pnpm i @ant-design/pro-cli -g
pro create myapp

# Umi 安装

1
2
3

? 🐂 使用 umi@4 还是 umi@3 ? (Use arrow keys)
❯ umi@4
  umi@3

如果选择了 umi@4 版本，暂时还不支持全量区块。
如果选择了 umi@3，还可以选择 pro 的模板，pro 是基础模板，只提供了框架运行的基本内容，complete 包含所有区块，不太适合当基础模板来进行二次开发

1
2
3

? 🚀 要全量的还是一个简单的脚手架? (Use arrow keys)
❯ simple
  complete

1
2
3

$ cd myapp && tyarn
// 或
$ cd myapp && npm install

# 开发

脚手架初始化成功之后就可以开始进行开发了，可以使用 @ant-design/pro 中提供的一些命令来辅助开发。

# start

运行这个脚本会启动服务，自动打开默认浏览器展示你的页面。当你重新编辑代码后，页面还会自动刷新。

# build

运行这个脚本将会编译你的项目，你可以在项目中的 dist 目录中找到编译后的文件用于部署。

如果需要部署，可以查阅部署。

# analyze

analyze 脚本做的事情与 build 的相同，但是他会打开一个页面来展示你的依赖信息。如果需要优化性能和包大小，就推荐使用。

# lint

我们提供了一系列的 lint 脚本，包括 TypeScript，less，css，md 文件。你可以通过这个脚本来查看你的代码有哪些问题。在 commit 中我们自动运行相关 lint。

[height='100px']

# lint:fix

与 lint 相同，但是会自动修复 lint 的错误。

[height='100px']

# i18n-remove

这个脚本将会尝试删除项目中所有的 i18n 代码，对于复杂的运行时代码，表现并不好，慎用。

更多的命令，可以看这里 https://umijs.org/zh-CN/docs/cli#umi-build