小白视角学antd umi(一) - 创建项目

这篇博客以初学者的角度介绍了如何使用umi 3.x创建React项目。内容包括umi 2.0和3.0项目的创建步骤,强调umi 3.x的推荐使用。文章适合已掌握React和Ant Design基础的读者,提到了umi项目的基本目录结构,并提醒读者注意不同umi版本之间的差异。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

这一系列文章以纯小白的视角介绍一下antd design的umi框架。文章全部基于umi 3.x版本,重点关注umi的基础使用和配置,比较偏实用,不会涉及原理和底层代码分析(因为底层啥样我也不知道~以后有时(xin)间(qing)再去研究研究)。

另外小白视角是针对umi框架而言的,读者仍然需要具有以下基础知识:React, Ant design。如果要配合dva使用的话,还需要了解redux(react-redux), redux-saga。

一、创建项目

这里介绍两种脚手架创建umi项目的方法。

umi 2.0项目

使用过antd pro的朋友可能知道,antd pro的官方教程里是这么创建pro项目的:

> yarn create umi

然后会有以下选项:

Select the boilerplate type (Use arrow keys)
  ant-design-pro  - Create project with an layout-only ant-design-pro boilerplate, use together with umi block.
❯  app            - Create project with a simple boilerplate, support typescript.
  block           - Create a umi block.
  library         - Create a library with umi.
  plugin          - Create a umi plugin.

如果选择 ant-design-pro,就会创建一个antd pro的项目。这里第二个选项app其实就是创建一个纯umi项目。但是这样创建的是一个umi 2.x的项目,而umi最新版本为3.x。要注意使用2.x版本的朋友要去阅读2.

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值