剧场模式
首页前后端分离Ant DesignAnt Design Pro 企业级后台实战

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

求知小风 · 真仙发布于新课程
0

注意,由于新的 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 · 合体
    Ebigbang · 合体 #1

  • Ebigbang · 合体
    Ebigbang · 合体 #2

    咋加载不是依赖呢

  • 思进 · 大乘
    思进 · 大乘 #3


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

  • 想卖咖啡的程序员 · 元婴

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

  • 思进 · 大乘
    思进 · 大乘 #5

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

  • 想卖咖啡的程序员 · 元婴

    回去再发你吧

  • 思进 · 大乘
    思进 · 大乘 #7

    好的,节日快乐,晚上等你!

  • 思进 · 大乘
    思进 · 大乘 #8

    我刚才用了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

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

  • 想卖咖啡的程序员 · 元婴

    因为最近有听过 antd pro 的源码会修改

  • 想卖咖啡的程序员 · 元婴

    npm install 一下

  • ✋✋ · 大乘
    ✋✋ · 大乘 #13

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

  • 想卖咖啡的程序员 · 元婴

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

加微信(qiuzhi99666)入群官方服务号
随机课程
Redux 入门教程(React 进阶)

Redux 入门教程(React 进阶)

20 个视频2 小时 18 分钟初级

Pro¥ 129.00¥ 103.20

Redux已完结

课程目录

1FreeAnt Design Pro 企业级后台实战 #1 介绍(声音已调到毫无杂音^_^)

2FreeAnt Design Pro 企业级后台实战 #2 学习的思想(二更)

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

4ProAnt Design Pro 企业级后台实战 #4 开始实战项目

5ProAnt Design Pro 企业级后台实战 #5 国际化与路由

6ProAnt Design Pro 企业级后台实战 #6 路由与菜单(今天第三更)

7ProAnt Design Pro 企业级后台实战 #7 使用 vscode 的代码提示来更好地写 antd pro 的代码

8ProAnt Design Pro 企业级后台实战 #8 更换主题的思想

9ProAnt Design Pro 企业级后台实战 #9 如何改变网站的主题风格

10ProAnt Design Pro 企业级后台实战 #10 如何创建页面

11ProAnt Design Pro 企业级后台实战 #11 如何修改请求的数据

12ProAnt Design Pro 企业级后台实战 #12 antd pro 是如何封装请求的

13ProAnt Design Pro 企业级后台实战 #13 修改数据

14ProAnt Design Pro 企业级后台实战 #14 分析组件得到数据的流程

15ProAnt Design Pro 企业级后台实战 #15 更改文件的内容

16ProAnt Design Pro 企业级后台实战 #16 为什么要使用 mock

17ProAnt Design Pro 企业级后台实战 #17 使用 mock 来摸拟数据

18ProAnt Design Pro 企业级后台实战 #18 如何来更好地使用 mock

19ProAnt Design Pro 企业级后台实战 #19 mock 功能、开发环境与生产环境

20ProAnt Design Pro 企业级后台实战 #20 不使用 Mock,如何改为本地的服务

21ProAnt Design Pro 企业级后台实战 #21 代理与跨域

22ProAnt Design Pro 企业级后台实战 #22 umi 支持独立的 mock 服务吗 part 1

23ProAnt Design Pro 企业级后台实战 #23 umi 支持独立的 mock 服务吗 part 2

24ProAnt Design Pro 企业级后台实战 #24 把 ant design pro 部署到线上服务器 part 1

25ProAnt Design Pro 企业级后台实战 #25 把 ant design pro 部署到线上服务器 part 2(第一部分完结)

26ProAnt Design Pro 企业级后台实战 #26 更新内容与计划(第二部分开始更新)

27ProAnt Design Pro 企业级后台实战 #27 引入真实的后端 API 服务(解决包版本依赖问题)

28ProAnt Design Pro 企业级后台实战 #28 创建好后端服务(解决数据库问题)

29ProAnt Design Pro 企业级后台实战 #29 从后端获得请求的数据内容(第二更)

30ProAnt Design Pro 企业级后台实战 #30 简单了解下分页

31ProAnt Design Pro 企业级后台实战 #31 表格组件(第二更)

32ProAnt Design Pro 企业级后台实战 #32 表格 Table 和 卡片 Card

33ProAnt Design Pro 企业级后台实战 #33 前端获得后端 API 返回的列表数据(第二更)

34ProAnt Design Pro 企业级后台实战 #34 前端 connect model 的数据

35ProAnt Design Pro 企业级后台实战 #35 前端 render 出后端的数据(第二更)

36ProAnt Design Pro 企业级后台实战 #36 代码提交时关闭 eslint 检查(husky、lint-staged)

37ProAnt Design Pro 企业级后台实战 #37 显示正确的数据(第二更)

38ProAnt Design Pro 企业级后台实战 #38 显示正在加载中 loading 的标志

39ProAnt Design Pro 企业级后台实战 #39 处理表格内容的显示(时间格式化)(第三更)

40ProAnt Design Pro 企业级后台实战 #40 分页

41ProAnt Design Pro 企业级后台实战 #41 前端的分页组件(第二更)

42ProAnt Design Pro 企业级后台实战 #42 前端发送请求带上分页的页数参数(第四更)

43ProAnt Design Pro 企业级后台实战 #43 后端手动处理分页(理解原理)

44ProAnt Design Pro 企业级后台实战 #44 前端显示正确的分页信息

45ProAnt Design Pro 企业级后台实战 #45 完成分页(第二部分结束,进入登录注册环节)

46ProAnt Design Pro 企业级后台实战 #46 登录功能的问题(第三部分开启,第四更)

47ProAnt Design Pro 企业级后台实战 #47 登录组件

48ProAnt Design Pro 企业级后台实战 #48 登录的请求

49ProAnt Design Pro 企业级后台实战 #49 分析登录权限的源码

50ProAnt Design Pro 企业级后台实战 #50 为什么要把数据存储到 localStorage 或 cookies

51ProAnt Design Pro 企业级后台实战 #51 实例讲解权限控制是如何运作的(第二更)

52ProAnt Design Pro 企业级后台实战 #52 详细分析权限的源码

53ProAnt Design Pro 企业级后台实战 #53 权限管理的组件分析

54ProAnt Design Pro 企业级后台实战 #54 为什么要使用 json web token

55ProAnt Design Pro 企业级后台实战 #55 什么是 json web token(jwt)

56ProAnt Design Pro 企业级后台实战 #56 生成 json web token

57ProAnt Design Pro 企业级后台实战 #57 实例讲解如何用 headers 返回 jwt - umi-request

58ProAnt Design Pro 企业级后台实战 #58 详细讲解如何用 cookies 返回 jwt - cookie-parser

59ProAnt Design Pro 企业级后台实战 #59 客户端解析 jwt 获得权限数据

60ProAnt Design Pro 企业级后台实战 #60 解决登录问题(二更)

61ProAnt Design Pro 企业级后台实战 #61 不能只相信前端,安全问题!

62ProAnt Design Pro 企业级后台实战 #62 umi-request 发送请求时带上头部认证信息

63ProAnt Design Pro 企业级后台实战 #63 服务器端验证 json web token

64ProAnt Design Pro 企业级后台实战 #64 处理 json web token 的各种问题

65ProAnt Design Pro 企业级后台实战 #65 用 umi-request 的拦截器解决登录之后的头信息发送问题

66ProAnt Design Pro 企业级后台实战 #66 伪造 json web token ?

67ProAnt Design Pro 企业级后台实战 #67 处理请求当前用户的问题

68ProAnt Design Pro 企业级后台实战 #68 当前用户与一些组件 part 1

69ProAnt Design Pro 企业级后台实战 #69 最烦人的一集,重大的关于重新登录的 bug

70ProAnt Design Pro 企业级后台实战 #70 当前用户与一些组件 part 2

71ProAnt Design Pro 企业级后台实战 #71 关于路由的一些问题(二更,还有三更)

72ProAnt Design Pro 企业级后台实战 #72 如何给 dva 添加一个插件

73ProAnt Design Pro 企业级后台实战 #73 完结(第四更)

学员(540)
萎鳴咸一 · 真仙xiejunping · 元婴helloforrestworld · 元婴青柠檬 · 元婴毛毛 · 元婴温文尔雅 · 道祖zhoulingfengofcd · 真仙wangmingyuan · 练虚The One That Got Away · 元婴xuan200922702 · 大乘随风 · 元婴严维伟 · 元婴
最新动态
萎鳴咸一 · 真仙学习到了8:09
xiejunping · 元婴学习到了0:29
helloforrestworld · 元婴学习到了1:04
青柠檬 · 元婴学习到了0:00
毛毛 · 元婴学习到了9:02
统计信息
    学员: 15252
    视频数量: 881
    帖子数量: 433

© 汕尾市求知科技有限公司 | 粤ICP备19038915号 | 在线学员:138

Top