注意 Node 的版本應(yīng)大于等于 16，安裝完 Node 后建議設(shè)置 npm 鏡像（淘寶源）以加速后面的過程（或使用科學(xué)上網(wǎng)工具）。

前言

如果你之前沒有接觸過 Android 的開發(fā)環(huán)境，那么請做好心理準(zhǔn)備，這一過程相當(dāng)繁瑣。請萬分仔細(xì)地閱讀下面的說明，嚴(yán)格對照文檔進(jìn)行配置操作。

譯注：請注意?。。鴥?nèi)用戶必須必須必須有穩(wěn)定的代理軟件，否則在下載、安裝、配置過程中會不斷遭遇鏈接超時或斷開，無法進(jìn)行開發(fā)工作。某些代理軟件可能只提供瀏覽器的代理功能，或只針對特定網(wǎng)站代理等等，請自行研究配置或更換其他軟件。總之如果報錯中出現(xiàn)有網(wǎng)址，那就是因為鏈接源倉庫的網(wǎng)絡(luò)鏈接被阻斷了，這一阻斷現(xiàn)象可能因時間、地區(qū)、運營商而不同。

一、環(huán)境搭建

低于 0.73 版本的 React Native 需要 JDK 11 版本，而低于 0.67 的需要 JDK 8 版本。

• 注意：強烈建議始終選擇 Node 當(dāng)前的 LTS （長期維護）版本，一般是偶數(shù)版本，不要選擇偏實驗性質(zhì)的奇數(shù)版本。
• 注意：不要使用 cnpm！cnpm 安裝的模塊路徑比較奇怪，packager 不能正常識別！

二、使用步驟

1.安裝jdk

因為我這里用的是0.68版本所以使用JDK 11 去官網(wǎng)下載JDK11 Temurin或Oracle JDK上下載(后者下載需注冊登錄)

java JDK安裝成功

2.安裝Android Studio

鏈接：下載 Android Studio 和應(yīng)用工具 - Android 開發(fā)者 | Android Developers 這個鏈接去下載

點擊下一步next

安裝界面中選擇"Custom"選項，確保選中了以下幾項：

• Android SDK
• Android SDK Platform
• Android Virtual Device

然后點擊"Next"來安裝選中的組件。

然后點擊這里的More Actions

找到SDK Manager。點擊"Configure"，然后就能看到"SDK Manager"

SDK Manager 還可以在 Android Studio 的"Preferences"菜單中找到。具體路徑是Appearance & Behavior → System Settings → Android SDK。

把紅箭頭標(biāo)注的東西都選擇好

然后點擊SDK Tools選項卡

還沒完,在"SDK Tools"選項卡，點擊"NDK (Side by side)"，同樣勾中右下角的"Show Package Details"，選擇20.1.5948944版

以上步驟都選好之后,點擊右下角的Apply進(jìn)行安裝

3. 配置 ANDROID_HOME 環(huán)境變量

React Native 需要通過環(huán)境變量來了解你的 Android SDK 裝在什么路徑，從而正常進(jìn)行編譯。

打開控制面板 -> 系統(tǒng)和安全 -> 系統(tǒng) -> 高級系統(tǒng)設(shè)置 -> 高級 -> 環(huán)境變量 -> 新建，創(chuàng)建一個名為ANDROID_HOME的環(huán)境變量，它指向的是你的 Android SDK 所在的目錄，具體的路徑可能和下圖不一致，請自行確認(rèn)

然后在Path配置

點開編輯后

創(chuàng)建新項目

如果你之前全局安裝過舊的react-native-cli命令行工具，請使用npm uninstall -g react-native-cli卸載掉它以避免一些沖突。

使用 React Native 內(nèi)建的命令行工具來創(chuàng)建一個名為"AwesomeProject"的新項目。這個命令行工具不需要安裝，可以直接用 node 自帶的npx命令來使用：

npx react-native init AwesomeProject

[可選參數(shù)] 指定版本或項目模板

你可以使用--version參數(shù)（注意是兩個杠）創(chuàng)建指定版本的項目。例如：

npx react-native init AwesomeProject --version X.XX.X

還可以使用--template來使用一些社區(qū)提供的模板，例如帶有TypeScript配置的：

npx react-native init AwesomeTSProject --template react-native-template-typescript

下載模擬器

默認(rèn)安裝在c盤可能模擬器運行不起來因為有中文路徑

可以自己手動配置變量安裝在別的路徑

總結(jié)

React Native 是一個由 Facebook 開發(fā)的開源框架，用于構(gòu)建跨平臺移動應(yīng)用程序。它允許開發(fā)人員使用 JavaScript 和 React 來編寫移動應(yīng)用，同時生成真正的原生應(yīng)用。

這意味著可以使用相同的代碼庫構(gòu)建 iOS 和 Android 應(yīng)用，從而提高開發(fā)效率和代碼復(fù)用性。

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

最新評論