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

相关推荐
崎岖Qiu27 分钟前
【计算机网络 | 第十三篇】网络层服务的两种实现方式:无连接和面向连接
网络·笔记·计算机网络
山岚的运维笔记40 分钟前
SQL Server笔记 -- 第65章:迁移 第66章:表值参数
数据库·笔记·sql·microsoft·sqlserver
前路不黑暗@1 小时前
Java项目:Java脚手架项目的登录认证服务(十三)
java·spring boot·笔记·学习·spring·spring cloud·maven
Hello_Embed3 小时前
Modbus 传感器开发:STM32F030 libmodbus 移植
笔记·stm32·学习·freertos·modbus
快乐zbc4 小时前
苍穹外卖 - 菜品起售/停售复习笔记
java·笔记
前路不黑暗@5 小时前
Java项目:Java脚手架项目的 B 端用户服务(十四)
android·java·开发语言·spring boot·笔记·学习·spring cloud
子辰ToT7 小时前
LearnOpenGL——高级光照(七)HDR
笔记·图形渲染·opengl
山岚的运维笔记8 小时前
SQL Server笔记 -- 第63章:事务隔离级别
数据库·笔记·sql·microsoft·oracle·sqlserver
智者知已应修善业9 小时前
【排列顺序判断是否一次交换能得到升序】2025-1-28
c语言·c++·经验分享·笔记·算法
HuDie3409 小时前
AI产品经理课程笔记
人工智能·笔记·产品经理