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

相关推荐
六点_dn4 分钟前
Linux学习笔记-shell运算符
linux·笔记·学习
降临-max1 小时前
软件测试基础---项目实战
软件测试·笔记·功能测试·测试用例
ndsc_d2 小时前
前端实战复盘:用AI直接生成响应式官网落地页与React源码
前端·人工智能·react.js·ui·前端框架·aigc·paico
鱼子星_2 小时前
【C++】内存管理:内存分布,new/delete的使用及细节处理,new/delete的底层,定位new表达式
开发语言·c++·笔记
愚昧之山绝望之谷开悟之坡2 小时前
回购逆回购
笔记
鱼子星_2 小时前
【C++】string(上):string的基本使用
c++·笔记·字符串
AOwhisky2 小时前
Python 学习笔记(第四期)——字符串:格式化、操作与文本处理——核心知识点自测与详解
开发语言·笔记·python·学习·列表·元组·字典
chnyi6_ya2 小时前
论文阅读笔记 | VIDEOPHY: Evaluating Physical Commonsense for Video Generation
论文阅读·笔记
AOwhisky3 小时前
Python 学习笔记(第六期)——函数:定义、参数传递与作用域
笔记·python·学习·云原生·运维开发·函数·参数传递
玖玥拾3 小时前
Unity 3D 基础(一)Unity基础架构、物理系统、视觉渲染、空间变换与对象查询
笔记·游戏·3d·unity·游戏引擎