下载官方项目
https://pro.ant.design/zh-CN/docs/getting-started
按照文档，下载项目。我们选择ts、complete（全部的-用来展示demo页）
文档中使用 tyarn。其他的可以自选例如：cnpm、npm等
安装cnpm : npm install -g cnpm --registry=https://registry.npmmirror.com
安装yarn、tyarn : npm install yarn tyarn -g
镜像链接 ： https://npmmirror.com/
运行及了解项目
我的项目位置D:/vsWork/OHD-REACT-PRO
启动项目
tyarn install
上面红线地方不要慌，放弃就行了。因为我的版本有问题。解决方案可以尝试以下下面的。（自行更改执行命令例如：yarn、cnpm等）
Browserslist: caniuse-lite is outdated. Please run:
#1、运行如下
npx browserslist@latest --update-db
或者
npm update
#2、还未为解决，运行如下
npm update caniuse-lite
#3、或者直接删了 node_modules/caniuse-lite 文件夹，然后重新安装
npm i -g caniuse-lite
#4、先删了 node_modules/caniuse-lite 和 node_modules/browserslist 两个文件夹
npm i --save-dev caniuse-lite browserslist
打开package.json 查看命令并启动
我们先整理以下，我们的代码。
tyarn lint:prettier
tyarn lint:style
lint:fix（这个命令执行完，不出意外肯定报错，我这头解决方案，上手忽略错误）
大致描述以下更改。找到对应文件，因为都是自带的页面，我们也不会加入业务，所以错误就直接忽略了。
例如：第一错误在57行 我们处理方式为 // eslint-disable-line
其他错误我们偷个懒直接删除掉错误的注释（删除掉灰色的代码）
出现这个，按照命令执行 cnpm i --save-dev @types/lodash.debounce
以上问题可以采用其他办法解决，与我本地环境有关，碰不见最好。
运行项目 tyarn start
可以直接进入项目了
我这里忽略了国际化，目前用不到。搭建可以自定义选择
tyarn i18n-remove
添加如下配置使默认语言为中文。
动态主题、我估计这块应该有很多朋友闹心的地方吧。
我这里把主题放到footer组件里面了，大家自定义。
想要隐藏URL路径配置 disableUrlParams={true}
可能会出现默认回显样式错误，将app.tsx 引入defaultSettings配置文件 赋值到settings里面。>之后就可以查看到如下页面
开启暗色主题、紧凑主题添加如下配置（效果…）
官方提供的主题插件（2021-11-22 目前不建议）
tyarn add umi-plugin-antd-theme umi-plugin-setting-drawer --save（应该是你想要的，不过有点问题…自己体会。）
开始升级业务及说明（里面的业务代码是 OHD 官方已经编写完成的，与大家业务无关）
可以简单查阅，看一下部分源码分析
大家根据自己业务需求整改proxy.ts（里面有映射配置）
1、更改目录结构
因为我们要统一规整目录结构，所以要将官方的demo保留并与业务代码隔离,整合完成的目录如下，我们也需要对应整改路由地址。
感觉官方路由放到config.ts有点乱，我们整合到routes.ts里面来进行读取，并且整改路由地址等信息。
改完之后类似这种配置，添加了demo/
因为我们系统的登录页面，我们需要直接使用，所以我们将文件夹移入我们的sys文件夹内
我们来重启以下项目如果出现引入文件错误，对应整改位置，或者名字。例如 ./data 替换 ./data.d
我们可以看到路径更改了多了一个/demo
添加登录业务
理论上，我们的代码有自己的目录规则，但是为了后期更好的升级及整合ant.design pro我们就直接使用他现有的login api做更改。防止登录与mock冲突，我们更改一处，注掉mock一处
OHD用户
1、copy 主目录 src/service -> base 至新项目 src/service下
2、copy 主目录 src/utils 至新项目 src下
3、copy pages/sys/user/login/services 至 pages/sys/user/login/
4、改变service引入地址
5、替换 pages/sys/user/login/index.tsx 这个文件，或者有重大更改项，根据业务进行部分替换。
6、替换或更改 pages/app.tsx 这个文件。
7、因为我们是动态路由，所以替换app.tsx部分业务。（其他的开发者，可以着重看一下 pro 的运行时配置）
8、copy pages/sys、mgt下所有文件 至 pages下。完成所有替换
9、查看组件是否有未添加的
（******若未发生重大更新则可进行此描述更改，若发生重大更改，则更新内容部分api）
调整完结构如下
