1.Homebrew
安裝工具的工具brew ，如果是中國(guó)大陸, 請(qǐng)參考Homebrew國(guó)內(nèi)源 , 如果網(wǎng)絡(luò)足夠好，可以嘗試官網(wǎng)直接安裝brew 官網(wǎng)。
2.Node.js、WatchMan
官方推薦使用Homebrew來(lái)安裝 Node 和 Watchman。在命令行中執(zhí)行下列命令安裝（如安裝較慢可以嘗試阿里云的鏡像源）：
brew install node@16
brew install watchman
安裝完 Node 后建議設(shè)置 npm 鏡像（淘寶源）以加速后面的過(guò)程（或使用科學(xué)上網(wǎng)工具）。
npm config set registry https://registry.npmmirror.com/
注意：
1.強(qiáng)烈建議始終選擇 Node 當(dāng)前的 LTS （長(zhǎng)期維護(hù)）版本，一般是偶數(shù)版本，不要選擇偏實(shí)驗(yàn)性質(zhì)的奇數(shù)版本。
2.不要使用 cnpm！cnpm 安裝的模塊路徑比較奇怪，packager 不能正常識(shí)別！
3.Yarn
Facebook 提供的替代 npm 的工具，可以加速 node 模塊的下載。
// 使用 npm 全局安裝 yarn,報(bào)錯(cuò)的試試前面加sudo
npm install yarn -g
// 檢查版本是否安裝成功
yarn -v
4.Android環(huán)境配置
1.安裝JDK
使用Homebrew來(lái)安裝由 Azul 提供的 名為 Zulu 的 OpenJDK 發(fā)行版。此發(fā)行版同時(shí)為 Intel 和 M1 芯片提供支持。在 M1 芯片架構(gòu)的 Mac 上相比其他 JDK 在編譯時(shí)有明顯的性能優(yōu)勢(shì)。
brew tap homebrew/cask-versions
brew install --cask zulu11
在命令行中輸入 javac -version 查看當(dāng)前jdk版本
2.下載AndroidStudio
官網(wǎng) https://developer.android.google.cn/studio/
1.國(guó)內(nèi)配置 Http Proxy
Android Studio是在谷歌的服務(wù)器上，初次安裝Android Studio時(shí)下載SDK等必定失敗，由于國(guó)際環(huán)境原因，大陸是無(wú)法正常訪問(wèn)谷歌的，所以我們?cè)谑褂肁ndroid Studio時(shí)需要設(shè)置HTTP Proxy 也就是網(wǎng)絡(luò)代理
2.打開(kāi)后按下圖，也就是選中“Auto-detect proxy settings”，勾選下方“Automatic proxy configuration URL”，填入國(guó)內(nèi)的某個(gè)鏡像站。點(diǎn)擊check connection 現(xiàn)實(shí)successful就說(shuō)明連接成功了
1.阿里云鏡像站地址：
mirrors.aliyun.com 端口：80
2.清華大學(xué)鏡像站地址：
mirrors.tuna.tsinghua.edu.cn 端口：80
3.北京外國(guó)語(yǔ)大學(xué)鏡像站地址：
mirror.bfsu.edu.cn 端口：80
4.中國(guó)科學(xué)院開(kāi)源協(xié)會(huì)鏡像站地址:
IPV4/IPV6: mirrors.opencas.cn 端口：80
IPV4/IPV6: mirrors.opencas.org 端口：80
IPV4/IPV6: mirrors.opencas.ac.cn 端口：80
5.上海GDG鏡像服務(wù)器地址:
sdk.gdgshanghai.com 端口：8000
6.北京化工大學(xué)鏡像服務(wù)器地址:
IPv4: ubuntu.buct.edu.cn/ 端口：80
IPv4: ubuntu.buct.cn/ 端口：80
IPv6: ubuntu.buct6.edu.cn/ 端口：80
7.大連東軟信息學(xué)院鏡像服務(wù)器地址:
mirrors.neusoft.edu.cn 端口：80
8.騰訊Bugly 鏡像:
android-mirror.bugly.qq.com 端口：8080
2.安裝SDK
需要安裝下面三個(gè)
Android SDK
Android SDK Platform
Android Virtual Device
1.首先配置sdk的路徑
2.SDK 下載
在 SDK Manager 中選擇"SDK Platforms"選項(xiàng)卡，然后在右下角勾選"Show Package Details"。展開(kāi)Android 13 (Tiramisu)選項(xiàng)，確保勾選了下面這些組件（重申你必須使用穩(wěn)定的代理軟件，否則可能都看不到這個(gè)界面）：Android SDK Platform 33
Intel x86 Atom_64 System Image（官方模擬器鏡像文件，使用非官方模擬器不需要安裝此組件）或是Google APIs ARM 64 v8a System Image（針對(duì) Apple Silicon 系列機(jī)型）
然后點(diǎn)擊"SDK Tools"選項(xiàng)卡，同樣勾中右下角的"Show Package Details"。展開(kāi)"Android SDK Build-Tools"選項(xiàng)，確保選中了 React Native 所必須的33.0.0版本。你可以同時(shí)安裝多個(gè)其他版本。
3.創(chuàng)建模擬器
如果你剛剛才安裝 Android Studio，那么可能需要先創(chuàng)建一個(gè)虛擬設(shè)備。點(diǎn)擊"Create Virtual Device…“，然后選擇所需的設(shè)備類型并點(diǎn)擊"Next”，然后選擇Tiramisu API Level 33 image.
當(dāng)然也可以使用usb 連接真機(jī)調(diào)試
4.配置 ANDROID_HOME 環(huán)境變量
1、打開(kāi) Mac 的 Terminal 終端，輸入 cd ~/ 【進(jìn)入當(dāng)前用戶的home目錄】
2、輸入 touch .bash_profile 【如果沒(méi)有.bash_profile這個(gè)文件，則創(chuàng)建一個(gè)這個(gè)文件】
3、輸入 open .bash_profile【打開(kāi)我們創(chuàng)建的這個(gè)文件，此時(shí)應(yīng)該彈出一個(gè)文本編輯框，如果是第一次配置環(huán)境，那么文本編輯框?yàn)榭瞻住?br> 4、在打開(kāi)的文本編輯器中寫入如下代碼：
export ANDROID_HOME = Android SDK 路徑
export PATH=${PATH}:${ANDROID_HOME}/emulator
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/tools/bin
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
注意 4 中的 ANDROID_HOME 應(yīng)該根據(jù)自己的 sdk 路徑來(lái)填寫，其余可以直接復(fù)制。至于sdk路徑，可以打開(kāi)Android Studio，在preference(Windows的setting)中搜索sdk來(lái)查看。
5、在終端中輸入 source .bash_profile 【使我們的改動(dòng)生效】
6、輸入 adb 【驗(yàn)證是否完成配置，如果不顯示 adb: command not found，說(shuō)明配置完成 】
5.IOS環(huán)境
1.升級(jí)ruby（ARM架構(gòu)設(shè)備）
目前mac的默認(rèn)ruby環(huán)境都是2.6.10，但是默認(rèn)的cocoapods的版本支持已經(jīng)升級(jí)到了3.2.2，所以我們要升級(jí)當(dāng)前的ruby環(huán)境：
打開(kāi)終端執(zhí)行下面命令，等待安裝完成即可。
brew install ruby
然后我們繼續(xù)執(zhí)行：
ruby -v
執(zhí)行完命令后，其實(shí)還是原來(lái)的版本??，這是因?yàn)榄h(huán)境變量沒(méi)有配置。因此，還有一個(gè)步驟就是配置環(huán)境變量。
echo 'export PATH="/opt/homebrew/opt/ruby/bin:$PATH"' >> ~/.zshrc
source ~/.zshrc
ruby -v
如果出現(xiàn)的結(jié)果為3.2.2及以上版本，就說(shuō)明安裝成功。
2.安裝cocoapods
CocoaPods是用 Ruby 編寫的包管理器（可以理解為針對(duì) iOS 的 npm）。從 0.60 版本開(kāi)始 react native 的 iOS 版本需要使用 CocoaPods 來(lái)管理依賴。你可以使用下面的命令來(lái)安裝 CocoaPods。CocoaPods 的版本需要 1.10 以上。
1.安裝方式（選擇其中一種）
1.brew安裝
brew install cocoapods
2.我們更換gem鏡像地址
gem sources --remove https://rubygems.org/
gem sources -a https://gems.ruby-china.com/
如果正常則表示替換成功了，如果出現(xiàn)了下面的問(wèn)題，則說(shuō)明權(quán)限出了問(wèn)題。
這個(gè)時(shí)候我們要給他指出的文件夾開(kāi)放權(quán)限，終端執(zhí)行：
sudo chmod -R 777 /Users/lee/.local
這個(gè)之后再執(zhí)行上面的替換操作就會(huì)正常了。
2.安裝cocoapods
sudo gem install -n /usr/local/bin cocoapods
這個(gè)時(shí)候會(huì)提示我們安裝完成，但是沒(méi)有完，我們這個(gè)時(shí)候我們繼續(xù)執(zhí)行下一步。
3.下載pod依賴
終端執(zhí)行：
git clone https://github.com/CocoaPods/Specs.git ~/.cocoapods/repos/master
等待下載完成即可，此時(shí)cocoapods已經(jīng)安裝完成可以使用了
項(xiàng)目執(zhí)行 pod install
發(fā)現(xiàn)依賴經(jīng)常報(bào)錯(cuò)，類似于這種
Cloning into '/var/folders/7n/72jrkgcx71lgnyjsbyhlml1r0000gp/T/d20230912-44744-l9ibfb'...
fatal: unable to access 'https://github.com/lblasa/double-conversion.git/': HTTP/2 stream 1 was not closed cleanly before end of the underlying stream
我搜到的有效的解決方法，那就是在終端執(zhí)行：
git config --global --unset http.proxy
git config --global --unset https.proxy
3.下載Xcode
React Native 目前需要Xcode 12 或更高版本。你可以通過(guò) App Store 或是到Apple 開(kāi)發(fā)者官網(wǎng)上下載。這一步驟會(huì)同時(shí)安裝 Xcode IDE、Xcode 的命令行工具和 iOS 模擬器。
6.開(kāi)發(fā)工具
VScode 官網(wǎng)下載地址
新手記錄一下文章來(lái)源：http://www.zghlxwxcb.cn/news/detail-721531.html
參考：
React Native 官網(wǎng)
最新cocoapods安裝流程 https://blog.csdn.net/weixin_38201792/article/details/131599252
React Native實(shí)用開(kāi)發(fā)指南文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-721531.html
到了這里，關(guān)于React Native 環(huán)境配置（mac）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
