Ant Design Pro 企业级后台实战 #3 分析源码目录结构与跑起来（第三更）

下载源码海外散仙厉飞雨 · 化神发布于2019-04-01新课程

注意，由于新的 antd pro 源码已改变了，使用了 ts 来写，并且默认情况下删除了好多页面（看这里：Ant Design Pro v4 is Here），可以会出现下面的情况：

这是因为 antd pro 在不断更新，虽然录视频的时候，使用 antd pro 也是最新的版本，但是它是在不断地更新中。

可以这样解决，clone v2 版本的 antd pro (最新版应该会是 v4，没有 v3，不过还没正式发版，但是 github 的源码已经不是 v2 版本的）

第一步：

git clone https://github.com/ant-design/ant-design-pro --branch=v2

如果你不想 clone，也可以进这里下载：

https://github.com/ant-design/ant-design-pro/releases

第二步： npm install

cd ant-design-pro
npm install

第三步： npm start

npm start

如果 npm install 很慢，可能要自己用中国的源，比如搜索 npm 淘宝源，yarn 安装很慢 之类的字眼来解决，网上好多解决方法。

遇到一些库安装很慢，有些好像是可以忽略的，比如 puppeteer，等一些时间还是不行，就按 ctrl + c，再进行 npm install ，或实在不行，就搜索一下，类似这样：npm puppeteer 很慢

这样运行起来就跟视频中是一样的了，可以进行学习：

UmiJS & TypeScript & Ant Design Pro v4 从零开始实战教程这套课程会使用最新版的 antd pro v4。

https://pro.ant.design/docs/getting-started-cn

https://github.com/ant-design/ant-design-pro

https://github.com/ant-design/ant-design-pro/issues/2849

https://my.oschina.net/jiangxinxin/blog/775326

14 条回复

Ebigbang · 合体 #1 2019-06-04
Ebigbang · 合体 #2 2019-06-04

咋加载不是依赖呢
思进 · 大乘 #3 2019-06-07

请教为什么我启动的页面没有demo的菜单呢，同时输入 localhost:8000/user/login 没有进入登录页呢？谢谢
想卖咖啡的程序员 · 元婴 #4 2019-06-07

对思进 · 大乘 #10 回复

请教为什么我启动的页面没有demo的菜单呢，同时输入 localhost:8000/user/login 没有进入登录页呢？谢谢

你应该是 umi 生成的初始项目吧
思进 · 大乘 #5 2019-06-07

对想卖咖啡的程序员 · 元婴 #10 回复

你应该是 umi 生成的初始项目吧

我的步骤，第一步 git clone https://github.com/ant-design/ant-design-pro.git ,第二步：npm install,(yarn install 太慢了。)第三步：yarn start。正确的步骤应该是什么呢？感谢！祝端午节快乐！
想卖咖啡的程序员 · 元婴 #6 2019-06-07

对思进 · 大乘 #10 回复

我的步骤，第一步 git clone https://github.com/ant-design/ant-design-pro.git ,第二步：npm install,(yarn install 太慢了。)第三步：yarn start。正确的步骤应该是什么呢？感谢！祝端午节快乐！

回去再发你吧
思进 · 大乘 #7 2019-06-07

对想卖咖啡的程序员 · 元婴 #10 回复

回去再发你吧

好的，节日快乐，晚上等你！
思进 · 大乘 #8 2019-06-07

对想卖咖啡的程序员 · 元婴 #10 回复

回去再发你吧

我刚才用了ant-design-pro-cli初始化菜单也不行，怀疑是因为安装puppeteer 卡住导致了，这个包需要翻墙。
想卖咖啡的程序员 · 元婴 #9 2019-06-07
对思进 · 大乘 #10 回复

我刚才用了ant-design-pro-cli初始化菜单也不行，怀疑是因为安装puppeteer 卡住导致了，这个包需要翻墙。
注意，由于新的 antd pro 源码已改变了，使用了 ts 来写，并且默认情况下删除了好多页面（看这里：Ant Design Pro v4 is Here），可以会出现下面的情况：

这是因为 antd pro 在不断更新，虽然录视频的时候，使用 antd pro 也是最新的版本，但是它是在不断地更新中。
可以这样解决，clone v2 版本的 antd pro (最新版应该会是 v4，没有 v3 ^{_^{，不过还没正式发版）}}

第一步：
```
git clone https://github.com/ant-design/ant-design-pro --branch=v2
```
第二步： npm install
```
cd ant-design-pro
npm install
```
第三步： npm start
```
npm start
```
如果 npm install 很慢，可能要自己用中国的源，比如搜索 npm 淘宝源，yarn 安装很慢 之类的字眼来解决，网上好多解决方法。

遇到一些库安装很慢，有些好像是可以忽略的，比如 puppeteer，等一些时间还是不行，就按 ctrl + c，再进行 npm install ，或实在不行，就搜索一下，类似这样：npm puppeteer 很慢

这样运行起来就跟视频中是一样的了，可以进行学习：

UmiJS & TypeScript & Ant Design Pro v4 从零开始实战教程这套课程会使用最新版的 antd pro v4。
思进 · 大乘 #10 2019-06-07
对想卖咖啡的程序员 · 元婴 #10 回复
注意，由于新的 antd pro 源码已改变了，使用了 ts 来写，并且默认情况下删除了好多页面（看这里：Ant Design Pro v4 is Here），可以会出现下面的情况：

这是因为 antd pro 在不断更新，虽然录视频的时候，使用 antd pro 也是最新的版本，但是它是在不断地更新中。
可以这样解决，clone v2 版本的 antd pro (最新版应该会是 v4，没有 v3 ^{_^{，不过还没正式发版）}}

第一步：

git clone https://github.com/ant-design/ant-design-pro --branch=v2

第二步： npm install

cd ant-design-pro npm install

第三步： npm start

npm start

如果 npm install 很慢，可能要自己用中国的源，比如搜索 npm 淘宝源，yarn 安装很慢 之类的字眼来解决，网上好多解决方法。

遇到一些库安装很慢，有些好像是可以忽略的，比如 puppeteer，等一些时间还是不行，就按 ctrl + c，再进行 npm install ，或实在不行，就搜索一下，类似这样：npm puppeteer 很慢

这样运行起来就跟视频中是一样的了，可以进行学习：

UmiJS & TypeScript & Ant Design Pro v4 从零开始实战教程这套课程会使用最新版的 antd pro v4。
感谢，我刚才尝试了下，完美解决我的问题。现在已经可以正常继续了。感谢你这么用心去关注用户感受！同时，我贪心一些，多问下你是如何能快速知道这个问题产生的原因是因为代码版本的问题的呢？
想卖咖啡的程序员 · 元婴 #11 2019-06-08

对思进 · 大乘 #10 回复

感谢，我刚才尝试了下，完美解决我的问题。现在已经可以正常继续了。感谢你这么用心去关注用户感受！同时，我贪心一些，多问下你是如何能快速知道这个问题产生的原因是因为代码版本的问题的呢？

因为最近有听过 antd pro 的源码会修改
想卖咖啡的程序员 · 元婴 #12 2019-06-12

对 Ebigbang · 合体 #10 回复

咋加载不是依赖呢

npm install 一下
✋✋ · 大乘 #13 2019-07-09

请问这个是咋回事我下载的课程代码
想卖咖啡的程序员 · 元婴 #14 2019-07-09

对 ✋✋ · 大乘 #10 回复

请问这个是咋回事我下载的课程代码

应该是你后端没有跑 git clone git@github.com:hfpp2012/redux-login.git --branch=antd_pro_backend 你先跟着来，别急着跑起来的，前端要跑的时候不要开启 mock，后面有说的，你先过一遍吧