ReactNative:
https://github.com/facebook/react-native
https://reactnative.cn/docs/getting-started (可以先通讀一下這個)
環境搭建
(mac版)https://juejin.cn/post/7404860612758765605
搭建之前確認版本:
androidStudio <=> RN <=> xcode,并且對應版本也決定了IOS/ Android的可兼容版本。
我這邊就用JDK 17版本,RN版本0.73,Xcode安裝最新的就好。
1. 安裝軟件
- 安裝node版本,我直接v22
- 安裝JDK,使用17版本
brew install --cask zulu@17
- 安裝android Studio,安裝最新版的就行,其他的安裝配置全默認。安裝完成之后看看SDK Manage是這樣的。然后邊上有模擬器標簽,(下圖2??),里面已經裝了一個默認的模擬器。
一些簡單配置:
- 使用國內鏡像加速 SDK 下載(可選)
如果 SDK 下載速度較慢,可以配置國內鏡像源:
在 Preferences → Appearance & Behavior → System Settings → Android SDK。
進入 SDK Update Sites,手動添加:
https://mirrors.tencent.com/android/repository/
https://mirrors.aliyun.com/android/repository/- 中文配置
SDK版本根據模擬機型號選擇即可,默認好像是有下個16的。
2. 配置環境變量
找到.zshrc文件(命令行打開也行),往里面配置下面的環境變量,配置完記得source ~/.zshrc 執行。
其實ANDROID_HOME的地址就是上面SDK manage里面的地址
export ANDROID_HOME=$HOME/Library/Android/sdk
export PATH=$PATH:$ANDROID_HOME/tools
export PATH=$PATH:$ANDROID_HOME/platform-tools
export PATH=$PATH:$ANDROID_HOME/emulator
配置完畢后新開一個終端輸入adb
試試,這是用來插入USB真機調試的工具。輸出了一堆東西就行。
3. 運行模擬機試試
這個環節卡了我一周,服了,一直在找原因
報錯 The emulator process for AVD Medium_Phone has terminated
。
先說結論,我的macOS版本太低11點幾,androidStudio給我自動裝的工具庫底層需要v12.6版本以上才能運行,所以我重新升級了系統版本升級到v15就行了。
有幾個排查方向:
- 運行內存夠不夠。
- 路徑有沒有中文。
- ADB安裝好沒有,在控制臺輸入adb回車看看,有沒有正確安裝上。
OK上面的都好了,然后看SDK manage也都裝上了對應的SDK(第一個步驟有截圖),裝上了對應的模擬機,還是打不開,那恭喜你,根據下面的步驟重新檢查:(以下部分來自AI & 網絡)
1. 檢查Android開發環境
# 檢查Android SDK是否正確安裝
echo $ANDROID_HOME
# 應該輸出類似: /Users/xxx/Library/Android/sdk# 檢查PATH是否包含Android工具
echo $PATH | grep -i android# 檢查adb是否可用
adb version# 檢查模擬器工具
emulator -list-avds
我就是在emulator -list-avds
這個步驟的時候發現模擬器工具運行失敗,報錯提示我得裝12.6版本以上,升級解決了這個問題成功啟動模擬器了誒嘿!
emulator -list-avds
dyld: Symbol not found: __ZTVNSt3__115basic_stringbufIcNS_11char_traitsIcEENS_9allocatorIcEEEE
Referenced from: /Users/xxxx./Library/Android/sdk/emulator/lib64/libabseil_dll.dylib (which was built for Mac OS X 12.6)
Expected in: /usr/lib/libc++.1.dylib
in /Users/xxxx./Library/Android/sdk/emulator/lib64/libabseil_dll.dylib
zsh: abort emulator -list-avds
2. 創建Android模擬器
AI給出的是下面的命令行創建,但是我的建議是直接在androidStudio那可視界面創建更方便
# 列出可用的系統鏡像 sdkmanager --list | grep "system-images"# 安裝系統鏡像(選擇一個合適的版本) sdkmanager "system-images;android-34;google_apis;arm64-v8a" # 創建AVD(Android虛擬設備) avdmanager create avd -n "Pixel_4_API_34" -k "system-images;android-34;google_apis;arm64-v8a" -d "pixel_4" # 驗證模擬器創建成功 emulator -list-avds
其實創建真的很簡單,直接看沒有下載箭頭就行,界面像這樣:
創建一個最簡單的項目并且運行
npx react-native init NewProject
運行起來之后是一個這個樣子(注意:這個web頁面只能用來debug,不能訪問RN項目的路由,RN項目訪問只能在模擬機里面看到)