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

news2025/2/28 6:17:41

新建项目目录

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.coloradmin.cn/o/1087240.html

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

相关文章

在 TensorFlow 中调试

如果调试是消除软件错误的过程,那么编程一定是添加错误的过程。Edsger Dijkstra。来自 https://www.azquotes.com/quote/561997 一、说明 在这篇文章中,我想谈谈 TensorFlow 中的调试。 在之前的一些帖子(此处、此处和此处)中&…

RK3568平台开发系列讲解(驱动篇)Linux自带LED子系统驱动实验

🚀返回专栏总目录 文章目录 一、LED 驱动使能二、 Linux 内核自带 LED 驱动简介2.1、LED 灯驱动框架分析2.2、module_platform_driver 函数简析2.3、gpio_led_probe 函数简析三、设备树节点编写四、测试沉淀、分享、成长,让自己和他人都能有所收获!😄 📢我们以前都是自…

UE5中双pass解决半透明材质乱序问题

透明度材质乱序问题一直是半透明效果时遇到的比较多的问题,用多pass方案只能说一定程度上解决,当遇到多半透明物体穿插等情况时,仍然不能完美解决。 双pass方案Unity用的比较多,因为Unity支持多个pass绘制。在UE中我们可以以复制多…

【开源】给ChatGLM写个,Java对接的SDK

作者:小傅哥 - 百度搜 小傅哥bugstack 博客:bugstack.cn 沉淀、分享、成长,让自己和他人都能有所收获!😄 大家好,我是技术UP主小傅哥。 清华大学计算机系的超大规模训练模型 ChatGLM-130B 使用效果非常牛&…

【Qt之QTableWidget和QTreeWidget】树悬停、选择样式及表格表头和首行间隔线

QTableWidget设置表头与首行间隔线 win10 实例化QTableWidget后,表格表头和首行中间无间隔线,以下是通过样式表进行设置: // 设置横向表格头的间隔线,可设置四个方向的间隔线,不需要间隔线的可以设置为0px// border-left:0px sol…

同城本地顺风车微信小程序源码系统,前端+后端完整搭建教程

大家好,今天要给大家分享一款同城本地顺风车微信小程序源码系统,同城本地顺风车微信小程序源码系统是一种基于互联网和移动社交平台的顺风车服务系统,搭建起来也十分简单。 系统特色功能一览: 地图定位:用户可以通过地…

C#中的Dispatcher:Invoke与BeginInvoke的使用

Dispatcher是.NET框架中的一个重要概念,用于处理异步消息传递。在C#中,Dispatcher提供了两种方法:Invoke和BeginInvoke,用于控制线程上消息的顺序和执行方式。 目录 一、Dispatcher.Invoke二、Dispatcher.BeginInvoke三、使用场景…

极简c++(4)类的静态成员

静态数据成员 ::是作用域操作符&#xff01; #include<iostream> using namespace std;class Point{private:int x,y;public:point(int x 0,int y 0):x(x),y(y){}~point();int getX(){return x;}int getY(){return x;} }假设需要统计点的个数&#xff0c;考虑添加一个…

Krypton控件组使用之KryptonRibbon

1.去掉File按钮 2.去掉 Cutomize 菜单

安规电容总结

安规电容 顾名思义&#xff1a;电容即使失效后&#xff0c;也不会漏电或者放电伤人&#xff0c;要符合安全规定 多数高压认证产品都需要。 上图&#xff1a; X电容&#xff1a; Y电容&#xff1a; 区别&#xff1a; 电路示意&#xff1a;

安卓配置图标——Qt For Android

前言 相对于给PC端配置图标&#xff0c;给移动端配置有点复杂。 在做跨平台方面&#xff0c;我遵循的原则是能用Qt解决的&#xff0c;就使用Qt的方法&#xff0c;毕竟我对Qt还是很熟悉的。在配置图标方面&#xff0c;界面中所有风格样式都是可以通过qss配置的&#xff1b;平台…

使用 Apache Camel 和 Quarkus 的微服务(五)

【squids.cn】 全网zui低价RDS&#xff0c;免费的迁移工具DBMotion、数据库备份工具DBTwin、SQL开发工具等 在本系列的第三部分中&#xff0c;我们了解了如何在 Minikube 中部署基于 Quarkus/Camel 的微服务&#xff0c;这是最常用的 Kubernetes 本地实现之一。虽然这样的本地…

198、RabbitMQ 的核心概念 及 工作机制概述; Exchange 类型 及 该类型对应的路由规则;了解什么是JMS。

目录 JMS 讲解★ RabbitMQ的核心概念★ RabbitMQ工作机制★ Connection&#xff08;连接&#xff09; 与 Channel&#xff08;通信信道&#xff09;★ Exchange★ Exchange与Queue★ Exchange的类型&#xff08;4种&#xff09;及 该类型对应的路由规则 看RabbitMQ 之前&#x…

适合学生写作业的台灯有哪些?双十一学生台灯推荐清单

现在很多家长为了娃的学习需求&#xff0c;基本都会备上一盏台灯&#xff0c;但桌面台灯有其无法避免的局限性&#xff0c;比如&#xff1a;光照范围不够大、光线过度集中、光线均匀度不足、产生眩光等问题&#xff0c;可能会对孩子的视力健康带来不利影响。 因此建议大家选择…

兴趣社如何搭建一个兴趣社区?

社交产品的本质是帮助用户提升社交的质量与效率&#xff0c;而兴趣则是找到本质的捷径。用户对兴趣社区的使用主要是围绕兴趣爱好&#xff0c;社交属性以及粉丝活动三个方向。对感兴趣的话题&#xff0c;用户天然有更强的分享讨论欲&#xff0c;更期待与人社交互动。“越垂直的…

通过Moonbeam路由流动性,如何转移token至Hydra?

在Moonbeam路由流动性&#xff08;Moonbeam Routed Liquidity&#xff09;功能下&#xff0c;用户在简洁的界面即可从如以太坊、Solona、Polygon、Avalanche等生态将流动性转移至波卡平行链。 开始操作前&#xff0c;请先准备以下条件&#xff1a; 原始链上的资产 原始链上的g…

[elasticsearch]使用postman来查询数据

最近需要debug程序&#xff0c;debug的时候需要查找elasticsearch里面的数据是否正确。 第一步建立一个post请求&#xff0c;并按照图下的方式填上ur和参数&#xff1a; 发送post请求&#xff0c;url为&#xff1a; http://ip:port/index_name/_search我这里查询的是title字…

spring cloud config pattern 用法

看了官网,对pattern用法的讲解,感觉讲的不是很清楚,只是讲了 config server端的配置,没有讲清楚如果从 client 端连接 config server 端的话,需要怎么配置,其中最重要的就是怎么对pattern进行识别,摸锁了一段时间,搞清楚了pattern的用法 springboot version:3.0.4 s…

中科院提出“思维传播”,极大增强ChatGPT等模型复杂推理能力

中国科学院自动化研究所与耶鲁大学计算机系研究人员联合发布了&#xff0c;一份名为《思维传播:用大型语言模型进行基于类比的复杂推理》的论文。 ChatGPT等大型语言模型展示出了超强的创造能力&#xff0c;只需简单的文本提示就能生成小说、营销创意、简历等各种文本内容。但…

同城生活广告投放小程序源码系统 带完整搭建教程

今天给大家分享一个同城生活广告投放小程序源码系统&#xff0c;可以通过这个小程序投放广告来获取盈利&#xff0c;操作简单&#xff0c;后台功能强大&#xff0c;新手或小白不用担心。以下是部分核心代码&#xff1a; 系统特色功能如下&#xff1a; 多城市选择&#xff1a;该…