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

相关推荐
ysa05103011 小时前
动态规划-逆向
c++·笔记·算法
杭州杭州杭州13 小时前
李沐动手学深度学习笔记(4)---物体检测基础
人工智能·笔记·深度学习
傻小胖13 小时前
7.BTC-挖矿难度-北大肖臻老师客堂笔记
笔记·区块链
日更嵌入式的打工仔13 小时前
嵌入式系统设计师软考个人笔记<3>
笔记
挂机且五杀14 小时前
为什么在React地图组件里,memo 不是优化,而是生存?
前端·react.js·前端框架
求真求知的糖葫芦14 小时前
微波工程4.2节阻抗与导纳矩阵学习(自用)
笔记·学习·线性代数·矩阵·射频工程
利刃大大14 小时前
【Vue】组件生命周期 && 组件生命周期钩子
前端·javascript·vue.js·前端框架
junnhwan15 小时前
【计算机网络-CS168-textbook阅读笔记】传输层原理与TCP设计
笔记·计算机网络·tcp·cs168
wdfk_prog16 小时前
[Linux]学习笔记系列 -- [drivers][base]platform
linux·笔记·学习
cs.shunzhang17 小时前
[特殊字符]【实战笔记】解锁 oh-my-opencode 隐藏技巧:用 ulw 和 ralph-loop 压榨 AI 极限
笔记