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

相关推荐
蒸蒸yyyyzwd2 小时前
后端学习笔记三个知识
笔记·八股
Zhao-Jichao4 小时前
AI Prompting for Everyone 课程笔记 - P19 数据分析 Data Analysis
人工智能·笔记·数据分析
旖旎夜光5 小时前
【C++ 基础入门】类和对象(上):封装、对象模型与 this 指针
开发语言·c++·笔记·学习
ACP广源盛139246256735 小时前
选型笔记:Type‑C 扩展坞方案评估|DP1.2 转 HDMI2.0 桥接芯片 GSV2201D@ACP
笔记·硬件架构·硬件工程·视频·国产芯片
李长渊哦6 小时前
Qoder 自定义子智能体(Subagent)学习笔记
chrome·笔记·学习
pixelpilot7 小时前
Deta Surf:把笔记、文件和网页塞进同一个 AI 工作台
笔记·其他
蒸蒸yyyyzwd7 小时前
学习笔记 复盘
笔记·八股
旖旎夜光8 小时前
【C++ 基础入门】命名空间、输入输出、缺省参数与函数重载
开发语言·c++·笔记·学习
Highcharts.js9 小时前
React 中原生支持使用 JSX 组件配置自定义表格 Highcharts Grid
前端·javascript·react.js·前端框架·jsx·highcharts·自定义表格
JudithHuang10 小时前
React 嵌套路由与布局
前端·react.js·arcgis·react·react router