React和umi搭建项目的操作步骤

​​​​​​一、react脚手架新建项目

(1.1)、命令行

前提:react ES2015,nodejs v8+

npx create-react-app myReactName //2022年v16以下版本 myReactName(自定义项目名)

react中文官网,快速上手:react中文官网

react框架,脚手架命令行:脚手架创建项目命令行

(1.2)、项目目录结构

(1.3)、浏览器运行,端口号3000:

npm start

http://localhost:3000

二、umi脚手架

前提:组件库Atn-design和react框架是捆绑在一起,就像element+Vue2框架,就像element-plus+Vue3框架捆绑在一起。

参考官网:Ant-design官网

**(1.1)、**安装umi

命令行: npx @umijs/create-umi-app 或 yarn create @umijs/umi-app

目录结构:

浏览器运行,端口号3000:yarn start

**(1.2)、**全局安装umi

安装umi: npm install umi -g 或 yarn global add umi

查看umi是否安装成功: umi -v

相关推荐
M78佐菲13 分钟前
ARM学习笔记(9)
linux·arm开发·笔记·嵌入式硬件·学习
東隅已逝,桑榆非晚42 分钟前
priority_queue的介绍和使用
c++·经验分享·笔记·学习
驭渊的小故事1 小时前
MyBatis 入门:从 JDBC 到优雅操作数据库(一)
笔记·sql·spring
zhangrelay3 小时前
机器人或计算机智能与时间相关案例汇总(ROS2-ROS1)
linux·笔记·学习·ubuntu·机器人
Neo Wordsworth3 小时前
随便笔记2
笔记
zhangrelay13 小时前
ROS项目设计案例智能大模型正经乱答案例
linux·笔记·学习·ubuntu·机器人
probex_13 小时前
学习笔记:知识图谱是什么,在测试里能干什么
笔记·学习·知识图谱
以为你知道啊14 小时前
90年代复古博客
笔记
波力海苔夹心脆67515 小时前
C# 值类型与引用类型详解:存储位置、赋值机制、参数传递、相等比较、装箱拆箱与常见陷阱
开发语言·jvm·经验分享·笔记·c#·.net
AOI小白新手上路17 小时前
从 Keil 调试视角看 51 指针,到 Cortex-M 内存映射访问寄存器 · 学习笔记
笔记·学习