当前位置:   article > 正文

Umi + React + Ant Design Pro + TS 项目搭建_react+ts+umi+antd项目搭建

react+ts+umi+antd项目搭建

新建项目目录

mkdir 【项目名称】
  • 1

在对应目录 D:\react\demo 中,安装 Umi 脚手架:

yarn create umi
  • 1

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
接下来,安装将要用到的相关依赖 @umijs/plugins:

npm i @umijs/plugins -D
  • 1

@umijs/plugins 是 Umi 的官方插件集,包含了 valtio、react-query、styled-components、locale、access、qiankun 等大量插件,可让用户通过配置的方式一键开启和使用。

安装成功:
在这里插入图片描述

继续安装 antd , axios , @ant-design/pro-layout:

antd 是基于 Ant Design 设计体系的 React UI 组件库;

axios 是前端常用的网络请求库;

@ant-design/pro-layout 是用于生成中后台布局的组件。(将运行时依赖和编译时依赖分别保存到 dependencies 和 devDependencies,这也是目前社区推荐的方式。)

npm i antd axios @ant-design/pro-layout -S
  • 1

安装完成:
在这里插入图片描述

大功告成,执行命令启动项目:

npm run dev
  • 1
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/2023面试高手/article/detail/475084
推荐阅读