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

相关推荐
被考核重击13 分钟前
WASM学习笔记
笔记·学习·wasm
三品吉他手会点灯25 分钟前
C语言学习笔记 - 27.C编程预备计算机专业知识 - 什么是字节
c语言·开发语言·笔记·学习
中屹指纹浏览器44 分钟前
指纹浏览器硬件仿真技术解析:显卡、音频、外设指纹伪装原理
经验分享·笔记
李少兄1 小时前
编程中的 e 表示法:科学计数法在代码里的指南
笔记·科学计数法·e
ouliten2 小时前
[Triton笔记3]融合 Softmax (Fused Softmax)
笔记·triton
岑梓铭3 小时前
考研408《操作系统》复习笔记,第二章《2.3.3 + 2.3.4 经典同步问题、管程》
笔记·考研·操作系统·408·os
我命由我123453 小时前
Dart - Dart SDK、Hello World 案例、变量声明、常量声明、常量 final、字符串类型
前端·flutter·前端框架·html·web·dart·web app
前端小马3 小时前
PTE考试笔记
笔记·英语
m0_46644103詹湛4 小时前
FPGA时序优化与高速接口实战手册
笔记·学习·fpga开发·硬件架构·verilog
ai超级个体4 小时前
前端唯一的护城河?结合 AI 将字节组件库 Headless 化后的感想~
前端·react·ai编程·ant design·组件库·vibe coding