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

相关推荐
一只小菜鸡..25 分钟前
Stanford CS144 学习笔记 (四):网络拥塞控制与 AIMD 算法
网络·笔记·学习
Hammer_Hans35 分钟前
DFT笔记82
笔记
xuhaoyu_cpp_java1 小时前
SpringBoot学习(四)
java·经验分享·spring boot·笔记·学习
依然范特东2 小时前
动手学深度学习笔记--训练注意、梯度问题
人工智能·笔记·深度学习
钛态3 小时前
AI 组件生成评测:别只看页面能不能渲染
前端·vue·react·web
fanchenxinok4 小时前
学习笔记:LabVIEW中如何将解析S19/HEX的VI封装为子VI并供主VI调用
笔记·学习·labview·子vi
2301_809051144 小时前
基本电子电路元件 学习笔记
笔记·学习
濮水大叔5 小时前
Hooks 之后,为什么前端仍需要“包裹”能力?
vue.js·react.js·前端框架
一只小菜鸡..6 小时前
Stanford CS144 学习笔记 (二):传输层与数据通信机制
网络·笔记·学习
赵大仁7 小时前
Next.js + Vercel AI SDK 实战:30 分钟搭出流式 Chat 页面
前端·ai·实战·react·next.js·vercel