在Vue中搭建項目的步驟：1.首先安裝腳手架的環境，2.通過腳手架的指令創建項目

在React中有兩種方式去搭建項目：1.和Vue一樣，先安裝腳手架然后通過腳手架指令搭建；2.npx create-react-app my-app （項目名稱小寫的英文字母）

npm和npx的區別：npm搭建的命令環境，( 腳手架版本 )不會再發生變化。npx創建的項目永遠是最新的( 腳手架版本 )，它不用下載環境，直接創建項目

create-react-app 搭建

腳手架搭建：

npx create-react-app myapp

如果不想安裝最新的react版本怎么辦需要版本升級或降級：

npm i react-dom@18.3.1 --legacy-peer-deps
npm i react@18.3.1 --legacy-peer-deps執行以上命令會自動更新package.json中react-dom和react的版本號以及node_modules中的依賴包，無需手動修改刪除

項目目錄：

publicindex.html：單頁面應用的入口，唯一的htmlmanifest.json：移動端app配置文件（等同于uniApp中的manifest.json）robots.txt：爬蟲協議，給搜索引擎看的，這個協議沒有強制性，它是用于pc端的（小程序中的爬蟲協議是sitemap.json）
srcApp.css：根組件的css文件App.js：根組件的js文件App.test.js：根組件的測試文件（可以不要）index.css：全局css文件index.js：主入口js文件（類似于vue的main.js）reportWebVitals.js：配置測試用的（可以不要）setupTests.js：在它里面配置引入了測試文件/模塊（可以不要）.gitignore：git文件，哪些文件不需要上傳package.json：項目對npm各種包的依賴，但是它鎖定的是大版本，也就是版本號第一位如："react": "^18.3.1"，鎖定的是18如果有向上的標號"^"，是根據情況下載最新的包，所以實際上可能項目中的包版本是"react": "^18.3.3"package-lock.json：鎖定安裝時的包的版本號，需要上傳到git，保證大家的依賴包一致

vite 搭建

npm create vite@latest

npm create vite@latest myapp -- --template react npm create vite@latest myapp -- --template react-ts  

相關下載

AntD：npm install antd --save

官網：https://ant.design/docs/spec/introduce-cn  （螞蟻金服的UI框架Ant Design）Ant Design它提供組件庫：React基于移動端的組件庫：Ant Design Mobile  <!-- https://mobile.ant.design/zh/ -->Vue各個版本： Ant Design of Vue  <!-- https://antdv.com/docs/vue/introduce -->Angular：Ant Design of Angular  <!-- https://ng.ant.design/docs/introduce/zh -->(1) 使用的時候，在組件內引入，按需加載import {Button} from 'antd';<Button type="primary">Primary Button</Button>(2) 引入主文件，src > App.css中引入（重置默認樣式表，或者其它的如：Normalize.css）@import '~antd/dist/reset.css';

路由：npm i react-router-dom

ReactRouter包含三個內容：(1) react-router：核心庫
(2) react-router-dom：正常PC用的
(3) react-router-native：移動native用的

Sass：npm i sass

如何在React中使用Less | Sasssass(1) npm i sass(2) src > App.scss（sass文件的后綴有兩種：.scss 或 .sass，前者更符合我們的代碼編寫習慣）less(1) npm i less less-loader（less-loader可以把less轉成css）(2) 改react的配置項目create-react-app的配置文件被作者隱藏起來了，需要暴露配置文件首先需要將項目提交到本地倉：git add .git commit -m 'init'(3) npm run eject （暴露配置，彈出配置操作是不可逆的）(4) config文件夾下 => webpack.config.js文件 （具體修改內容查看文件中，修改了配置文件后重啟一下項目）快捷鍵：ctrl + f，查找輸入：scss，修改后即可在React中使用Less

清理項目，將多余的文件不要的內容刪除