# Ant Design Pro入门
由于 antd pro v4 源码已改变（使用了 ts 来写），并且默认情况下只有一个模版
页面（删除了好多页面），为了快速搭建和熟悉antd pro，所以我们可以clone v2 版本的 antd pro。
# 安装Ant Design Pro
# 第一步，进这里下载 v2 版本：
https://github.com/ant-design/ant-design-pro/releases
# 第二步： npm install
安装前首先要设置npm用中国的源，然后再执行install。
修改npm的源：
//设置淘宝源
npm config set registry https://registry.npm.taobao.org
//查看源，可以看到设置过的所有的源
npm config get registry
1
2
3
4
2
3
4
切换到ant-design-pro目录下执行install
cd ant-design-pro
npm install
1
2
2
这里可能很慢，没关系，可以多等会，或者ctrl+c退出，然后再执行一次npm install，只要能成功一次就行。
安装后可能会发现puppeteer的错误信息：
ERROR: Failed to download Chromium r674921! Set "PUPPETEER_SKIP_CHROMIUM_DOWNLOAD" env variable to skip download.
这个错误好像可以忽略，我第一次安装时出现了上面的错误信息，执行start仍然可以正常启动。
如果你比较谨慎，也可以采用--ignore-scripts重新安装的方式解决puppeteer的问题：
npm i --save puppeteer --ignore-scripts
1
# 第三步： 启动
npm start
1
# 目录结构(v2)
├── .temp # 运行起来生成的临时文件(less)
├── config # 基础配置：umi 配置，包含路由，构建等配置
├── mock # 本地模拟数据
├── node_modules # 依赖包
├── public # 公共信息配置（图片、视频等）
│ └── favicon.png # Favicon
├── scripts # 打包的一些js，也是项目底层调用的
├── src # 我们开发时除了配置文件外主要操作的地方
│ ├── assets # 本地静态资源，跟上面public一样的公共文件（例如logo），
│ ├── components # 业务通用组件
│ ├── e2e # 集成测试用例、部署文件
│ ├── layouts # 通用布局
│ ├── locales # 国际化资源
│ ├── models # 全局 dva model（services按models维度进行拆分文件）
│ ├── pages # 业务页面入口和常用模板
│ ├── services # 后台接口服务（跟models对应，models有的services也有））
│ ├── utils # 工具库
│ ├── app.js # 项目的入口
│ ├── defaultSettings.js # 默认的配置
│ ├── global.less # 全局样式
│ ├── global.js # 全局 JS
│ └── manifest.json # 配置整体项目
├── tests # 测试工具
├── .dockerignore # 打包docker时用到
├── .eslintignore # ES6语法检测忽略信息
├── .prettierignore # 语法检测
├── Dockerfile # 跟上面Docker文件是相关的
├── jest.config.js # 开发部署打包用到
└── package.json
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29