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

相关推荐
IT1995几秒前
Qt笔记-使用SSH2进行远程连接linux服务器并上传文件
linux·服务器·笔记
利刃大大2 小时前
【2025年度创作总结】从笔记到实践,从思考到生活融合
笔记·生活
航Hang*2 小时前
Photoshop 图形与图像处理技术——第1章:数字图像基本知识
图像处理·笔记·ui·photoshop
iconball4 小时前
个人用云计算学习笔记 --37 Zabbix
运维·笔记·学习·云计算·zabbix
Yiii_x5 小时前
Object类与包装类
java·经验分享·笔记·课程设计·ai编程
四谎真好看5 小时前
MySQL 学习笔记(运维篇1)
运维·数据库·笔记·学习·mysql·学习笔记
hssfscv6 小时前
Javaweb学习笔记——Web
笔记·学习·web
摇滚侠6 小时前
RocketMQ 教程丨深度掌握 MQ 消息中间件,rocketmq 安装,控制台,笔记 21-27
笔记·rocketmq·java-rocketmq
李派森6 小时前
软考高项(信息系统项目管理师)—第22章 组织通用治理全解析
网络·笔记·计算机网络
AI视觉网奇6 小时前
ue重定向学习笔记
笔记·ue5