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

相关推荐
W|J11 分钟前
ES 学习笔记
笔记·学习·elasticsearch
张人玉11 分钟前
西门子 S7 PLC 通信 WPF 应用分析笔记
笔记·c#·wpf·plc
@zulnger17 分钟前
python 学习笔记(循环)
笔记·python·学习
Hammer_Hans24 分钟前
DFT笔记16
笔记
我命由我1234528 分钟前
开发中的英语积累 P25:Axis、Stroke、Corner、Interceptor、Declared、Internal
经验分享·笔记·学习·职场和发展·求职招聘·职场发展·学习方法
扑火的小飞蛾40 分钟前
【Ansible学习笔记01】 批量执行 shell 命令
笔记·学习·ansible
hunter145040 分钟前
2026.1.4 html简单制作
java·前端·笔记·html
葡萄杨1 小时前
【存算芯片】存算阵列模型和wavedrom
笔记
中屹指纹浏览器1 小时前
2026指纹浏览器技术选型与实践:从单账号到千级矩阵的部署优化
经验分享·笔记
Hao_Harrision1 小时前
50天50个小项目 (React19 + Tailwindcss V4) ✨| AnimatedCountdown(倒计时组件)
前端·typescript·react·tailwindcss·vite7