andt-pro:搭建一个ant-design-pro项目(模板)

序言

每天得生活都要继续,每天的学习不能放弃,最近开始学习下umi/dva/antd的后台管理系统,首推自然是antd-pro了,有些朋友应该比较熟悉这个了,就不多说,直接正言介绍,下面的主线都是antd-pro的搭建;

准备

Create umi

创建antd-pro或dva项目的脚手架

dva

dva 首先是一个基于 redux 和 redux-saga 的数据流方案,
然后为了简化开发体验,dva 还额外内置了 react-router 和 fetch ,
所以也可以理解为一个轻量级的应用框架。

umi

Umi,中文可发音为乌米,是可扩展的企业级前端应用框架。Umi 以路由为基础的,
同时支持配置式路由和约定式路由,保证路由的功能完备,并以此进行功能扩展。
然后配以生命周期完善的插件体系,覆盖从源码到构建产物的每个生命周期,
支持各种功能扩展和业务需求。

正文

1.在创建的项目文件下使用cmd运行create umi

npm create umi

2.选择antd-pro

3.选择ts/js(新手用js比较好)

4.用ant4?

5.进入到创建的项目中,然后用cnpm install再npm start

6.最后效果

关键文件

config/config.js
项目的配置文件,详情配置请参考umi的配置页面
内部有路由模块:routes

src/models
dva的model的文件放置地

src/pages
业务代码的页面

运行流程

主要看下umi的文档,了解下各个模块所负责的

参考资料

create umi的npm地址

dva地址

umi地址

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值