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

相关推荐
hanlin035 小时前
刷题笔记:力扣第32题-最长有效括号
笔记·算法·leetcode
xian_wwq7 小时前
【学习笔记】Milvus 如何完成一次向量相似度检索,Milvus 索引到底应该怎么选?-15
笔记·学习·milvus
小天源8 小时前
智叟云集系统架构解析:从品牌 AI 可见度监测到前后端协同
人工智能·react.js·系统架构·node.js·react·ai监测·ai品牌监测
wujiuhsu10 小时前
图片里的简体中文怎么翻译成繁体?商品图、详情页和海报批量转换方法
经验分享·笔记
keyipatience13 小时前
JS学习笔记(2)数组,函数,作用域,对象
前端·javascript·笔记·学习·html
你想知道什么?13 小时前
词向量总结-学习笔记
人工智能·笔记·学习
He BianGu13 小时前
【笔记】WPF中RenderOptions类的详细功能
笔记·wpf
用AI来创业吧13 小时前
网站建设公司哪家好:报价差 3 倍,差在哪四项成本上(选型笔记)
笔记·性能优化·软件工程·安全威胁分析
一支蜉蝣15 小时前
Day25 XD安全笔记 安全开发-PHP 应用&文件管理模块&包含&上传&遍历&写入&删除&下载&安全
笔记·网络安全·php
Awh-15 小时前
ARM 裸机开发 DAY10 学习笔记
arm开发·笔记·学习