Umi + React + Ant Design Pro + TS 项目搭建

新建项目目录

mkdir 【项目名称】

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

yarn create umi

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

npm i @umijs/plugins -D

@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

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

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

npm run dev

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/103757.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Excel 数据透视表

参考: https://blog.csdn.net/weixin_47267618/article/details/118466565

每日一题AC

4.小花和小草正在沙滩上玩挖沙洞的游戏。他们划了一条长度为n米的线作为挖沙洞的参考线路,小花和小草分别从两头开始沿着划好的线开始挖洞,小花每隔a米挖一个洞,小草每隔b米挖一个洞,碰到已经挖过洞的就不需要再挖了。那么&#x…

排序算法——冒泡排序

一、介绍: 冒泡排序原理就是从第一个元素开始,比较其后边的一个元素的大小,按照排序方式进行交换位置,直到将所有元素的顺序排列好为止。演示如下: 视频演示: 冒泡排序演示_网络游戏热门视频 (bilibili.co…

Linux 安全 - DAC机制

文章目录 一、安全简介二、DAC2.1 UNIX 的自主访问控制2.2 Linux 的自主访问控制 三、进程凭证3.1 简介3.2 uid/gid3.3 系统调用 四、客体标记4.1 简介4.2 系统调用 五、UGO规则源码分析参考资料 一、安全简介 计算机系统应对安全挑战的办法大致有四种:隔离、控制、…

【Spring Boot】RabbitMQ消息队列 — RabbitMQ入门

💠一名热衷于分享知识的程序员 💠乐于在CSDN上与广大开发者交流学习。 💠希望通过每一次学习,让更多读者了解我 💠也希望能结识更多志同道合的朋友。 💠将继续努力,不断提升自己的专业技能,创造更多价值。🌿欢迎来到@"衍生星球"的CSDN博文🌿 🍁本…

GEO生信数据挖掘(七)差异基因分析

上节,我们使用结核病基因数据,做了一个数据预处理的实操案例。例子中结核类型,包括结核,潜隐进展,对照和潜隐,四个类别。本节延续上个数据,进行了差异分析。 差异分析 计算差异指标step12 加载…

蓝桥杯 题库 简单 每日十题 day13

01 乘积尾零 题目描述 本题为填空题,只需要算出结果后,在代码中使用输出语句将 所填结果输出即可。如下的10行数据,每行有10个整数,请你求出它们的乘积的末尾有多少个零? 5650 4542 3554 473 946 4114 3871 9073 90 …

汽车RNC主动降噪算法DSP C程序实现

汽车RNC主动降噪算法C程序 是否需要申请加入数字音频系统研究开发交流答疑群(课题组)?可加我微信hezkz17, 本群提供音频技术答疑服务,车载

rust 智能指针

智能指针 Box Box 的使用场景 由于 Box 是简单的封装,除了将值存储在堆上外,并没有其它性能上的损耗。而性能和功能往往是鱼和熊掌,因此 Box 相比其它智能指针,功能较为单一,可以在以下场景中使用它: 特…

Flink之DataStream API开发Flink程序过程与Flink常见数据类型

开发Flink程序过程与Flink常见数据类型 DataStream APIFlink三层APIDataStream API概述 开发Flink程序过程添加依赖创建执行环境执行模式创建Data Source应用转换算子创建Data Sink触发程序执行示例 Flink常见数据类型基本数据类型字符串类型时间和日期类型数组类型元组类型列表…

【通信系列 6 -- AT 命令介绍】

文章目录 1. 背景介绍1.2 AT的命令格式1.3 AT指令用法1.3.1 指令执行结果 1.2 CP 常用AT指令1.2.1 CP 模式设置1.2.2 网络相关1.2.3 IP获取1.2.4 Band 设置1.2.5 电话相关1.2.6 SIM卡检测1.2.7 cmwap 和cmnet1.2.8 AT 写 IMEI 1. 背景介绍 AT 命令一般分为三种: C…

1.1 向量与线性组合

一、向量的基础知识 两个独立的数字 v 1 v_1 v1​ 和 v 2 v_2 v2​,将它们配对可以产生一个二维向量 v \boldsymbol{v} v: 列向量 v v [ v 1 v 2 ] v 1 v 的第一个分量 v 2 v 的第二个分量 \textbf{列向量}\,\boldsymbol v\kern 10pt\boldsymbol …

【Java】如何将File转换成MultipartFile

假如你把你的后端项目部署在服务器上的时候,然后你要去读取某个路径下的文件,然后你就要提供文件的路径,然后获取到该文件对象,但是你需要将当前文件对象File转换成MultipartFile再发送http请求传递到其他服务器上,这样…

GPIO子系统(三)

1,简述 GPIO 资源是相对来说较为简单,而且比较通用(比如 LED 灯),而 Linux 的 GPIO 驱动属于 Linux Driver 中较为容易上手的部分,但是简单归简单,在 Linux 系统中,要使用 GPIO 资源…

mysql.mongoDb,neo4j数据库对比

Mysql与MongoDb和Neo4j的一些对比 主要区别 MySQL: 1.MySQL是一种关系型数据库管理系统(RDBMS),广泛用于处理结构化数据。 2.它支持SQL语言,具备成熟的事务处理和数据一致性能力。 3.MySQL适用于大多数传统的基于表格…

UE4和C++ 开发-头文件(.h) 和实现文件(.cpp)区别

.h文件和.cpp文件是C程序中的两种不同类型的文件。 .h文件通常包含类、函数和变量的声明, 而.cpp文件包含这些声明的实现。 .h文件中的声明通常是公共的,可以被其他文件包含和使用。.cpp文件中的实现通常是私有的,只能在该文件中使用。 在…

高级网络调试技巧:使用Charles Proxy捕获和修改HTTP/HTTPS请求

今天我将与大家分享一种强大的网络调试技巧,那就是使用Charles Proxy来捕获和修改HTTP/HTTPS请求。如果您是一位开发人员或者网络调试爱好者,那么这个工具肯定对您有着很大的帮助。接下来,让我们一起来学习如何使用Charles Proxy进行高级网络…

区块链加密虚拟货币交易平台安全解决方案

区块链机密货币交易锁遭入侵,安全存在隐患。使用泰雷兹Protect server HSM加密机,多方位保护您的数据,并通过集中化管理,安全的存储密钥。 引文部分: 损失7000万美元!黑客入侵香港区块链加密货币交易所 2023年9月&…

计算机毕业设计选什么题目好?springboot 健身房管理系统

✍✍计算机编程指导师 ⭐⭐个人介绍:自己非常喜欢研究技术问题!专业做Java、Python、微信小程序、安卓、大数据、爬虫、Golang、大屏等实战项目。 ⛽⛽实战项目:有源码或者技术上的问题欢迎在评论区一起讨论交流! ⚡⚡ Java实战 |…

HTML5简介-HTML5 新增语义化标签-HTML5 新增多媒体标签

一、HTML5简介 HTML5,全称为HyperText Markup Language 5,是HTML的第五个版本,由万维网联盟(World Wide Web Consortium,W3C)和Web Hypertext Application Technology Working Group(WHATWG&am…