Mac 的安裝程式

安裝包管理器 Homebrew brew

將其貼上到終端提示符處。

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

安裝 Xcode IDE

使用下面的連結下載或在 Mac App Store 中找到它

https://developer.apple.com/download/

注意: 如果你安裝了 Xcode-beta.app 以及 Xcode.app 的生產版本,確保你使用的是 xcodebuild 工具的生產版本。你可以用:

sudo xcode-select -switch /Applications/Xcode.app/Contents/Developer/

安裝 Android 環境

  • Git git

    *如果你已安裝 XCode,則已安裝 Git,否則請執行以下命令

    brew install git 
    
  • 最新的 JDK

  • Android Studio

    選擇自定義安裝

    StackOverflow 文件

    選擇效能和 Android 虛擬裝置

    StackOverflow 文件

    安裝完成後,從 Android Studio 歡迎視窗中選擇 Configure - > SDK Manager。

    StackOverflow 文件

    在 SDK 平臺視窗中,選擇顯示包詳細資訊,然後在 Android 6.0(Marshmallow) 下,確保選中 Google API,Intel x86 Atom System Image,Intel x86 Atom_64 系統映像和 Google API Intel x86 Atom_64 系統映像。

    StackOverflow 文件

    在 SDK Tools 視窗中,選擇 Show Package Details,在 Android SDK Build Tools 下,確保選中 Android SDK Build-Tools 23.0.1。

    StackOverflow 文件

  • 環境變數 ANDROID_HOME

    確保 ANDROID_HOME 環境變數指向你現有的 Android SDK。為此,將其新增到〜/ .bashrc,〜/ .bash_profile(或 shell 使用的任何內容)並重新開啟終端:

    如果你在沒有 Android Studio 的情況下安裝了 SDK,那麼它可能類似於:/ usr / local / opt / android-sdk

    export ANDROID_HOME=~/Library/Android/sdk
    

Mac 的依賴關係

你需要 Xcode for iOS 和 Android Studio for android,node.js,React Native 命令列工具和 Watchman。

我們建議通過 Homebrew 安裝 node 和 watchman。

brew install node
brew install watchman

Watchman 是 Facebook 用於觀察檔案系統變化的工具。強烈建議你安裝它以獲得更好的效能。這是可選的。

Node 附帶 npm,允許你安裝 React Native 命令列介面。

npm install -g react-native-cli

如果你收到許可權錯誤,請嘗試使用 sudo:

sudo npm install -g react-native-cli.

對於 iOS,安裝 Xcode 的最簡單方法是通過 Mac App Store。併為 Android 下載並安裝 Android Studio。

如果你打算在 Java 程式碼中進行更改,我們建議使用 Gradle Daemon 加速構建。

測試 React Native 安裝

使用 React Native 命令列工具生成名為 AwesomeProject 的新 React Native 專案,然後在新建立的資料夾中執行 react-native run-ios。

react-native init AwesomeProject
cd AwesomeProject
react-native run-ios

你很快就會看到你的新應用在 iOS 模擬器中執行。react-native run-ios 只是執行應用程式的一種方式 - 你也可以直接從 Xcode 或 Nuclide 中執行它。

修改你的應用

現在你已經成功執行了應用程式,讓我們對其進行修改。

  • 在你選擇的文字編輯器中開啟 index.ios.js 或 index.android.js 並編輯一些行。
  • 在 iOS 模擬器中點選 Command⌘+ R 重新載入應用程式並檢視更改! 而已!

恭喜! 你已成功執行並修改了第一個 React Native 應用程式。

來源: 入門 - React-Native