React Native 環境搭建

Ki_音發表於2019-02-16

平臺選擇

  • 移動應用平臺:Android
  • 開發平臺:Windows

開發環境搭建

1. Python 2

進入 python
建議選擇 pyhton 2.7.* 下載
注意目前不支援Python 3版本。

2. Node

進入 node 建議選擇LTS版本的Node下載

安裝完node後建議設定npm映象以加速後面的過程(或使用科學上網工具)。注意:不要使用cnpm!cnpm安裝的 模組路徑比較奇怪,packager不能正常識別!

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global

3. yarn

    npm install -g yarn

注意:目前npm5(我使用的版本為5.6.0)存在安裝新庫時會刪除其他庫的問題,導致專案無法正常執行。請儘量使用yarn代替npm操作。

yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

4. react-native-cli

    npm install -g react-native-cli

5. Android Studio

進入 Android Studio 下載Android Studio
預設安裝即可React Native目前需要Android Studio2.0或更高版本。

進入 Java Development Kit下載jdk
Android Studio需要Java Development Kit [JDK] 1.8(暫不支援更高版本)

  • 安裝完成後,在Android Studio的歡迎介面中選擇Configure | SDK Manager
  • 在SDK Platforms視窗中,選擇Show Package Details,然後在Android 6.0 (Marshmallow)中勾選Google APIs、Android SDK Platform 23、Intel x86 Atom System Image、Intel x86 Atom_64 System Image以及Google APIs Intel x86 Atom_64 System Image。
  • 在SDK Tools視窗中,選擇Show Package Details,然後在Android SDK Build Tools中勾選Android SDK Build-Tools 23.0.1(必須包含有這個版本。當然如果其他外掛需要其他版本,你可以同時安裝其他多個版本)。然後還要勾選最底部的Android Support Repository.

6. 環境變數配置

確保ANDROID_HOME環境變數正確地指向了你安裝的Android SDK的路徑。
Android SDK的路徑:C:Users使用者名稱AppDataLocalAndroidSdk

開啟控制皮膚 -> 系統和安全 -> 系統 -> 高階系統設定 -> 高階 -> 環境變數 -> 新建

將Android SDK的tools和platform-tools目錄新增到PATH變數中,以便在終端中執行一些Android工具,例如android avd或是adb logcat
tools路徑:C:Users使用者名稱AppDataLocalAndroidSdktools
platform-tools路徑:C:Users使用者名稱AppDataLocalAndroidSdkplatform-tools

開啟控制皮膚 -> 系統和安全 -> 系統 -> 高階系統設定 -> 高階 -> 環境變數 -> 選中PATH -> 雙擊進行編輯

開始執行

    react-native init App
    cd App
    yarn install
    adb device                    檢視是否存在可調式裝置
    react-native run-android

相關文章