React Native 環境搭建攻略

標籤：

Facebook 於 2015 年 9 月 15 日發布了 React Native for Android， 把 Web 和原生平台的 JavaScript 開發技術擴充到了 Google 的流行移動平台--Android。

近期閑來無事想搭建環境玩耍一下。現把遇到的問題總結一下希望對於新手有所協助。

首先我運氣很好得找到了極客學院翻譯的中文版wiki於是按照下面的說明進行了搭建

PS: 文檔詳細內容請移步: (http://wiki.jikexueyuan.com/project/react-native/)

第一次搭建的時候由於對mac系統的不熟悉怎麼都搞得不順心，感覺這個命令好難用啊頭痛。初次搭建時湊合能夠打包安裝但運行時遇到了好多的問題

問題一：真機上運行白屏

解決方案：

我的主力開發機器是 Android 4.4 的。按照官方文檔，需要按 menu 鍵或者搖晃手機，在開發菜單中設定一下 dev server 的 IP 位址。前面我就試過了，我怎麼操作都不能開啟這個菜單。突然想到，是不是系統屏蔽了？我去找系統使用權限設定，發現如下：

問題2：Unable to download JS bundle.Did you forget to start the development server or connect your device?

真機與模擬器上都出現這樣的問題，網上問了很多人也加群問了很多人最後鎖定為server沒有開啟。

解決辦法：對照了wiki教程重新走了一遍第一次搭建時各種軟體安裝得比較亂第二次有了第一次的經驗再重新搭建一次把以前漏掉得步驟走了一遍再react-native run-andriod.模擬器成功跑通。

 

問題3：跑通了類比哭再回頭看看真機還是不行跟問題二差不多隻是只有Unable to download JS bundle.這一句說明server啟動起來了

解決辦法：本來我是電腦與手機串連的一個wifi網路後來用電腦串連網線然後建立一個wifi手機再串連電腦建立的wifi然後菜單中選擇Dev Settings->Debug server host for device，填入你開發電腦的 IP 位址。問題解決。現在模擬器手機都可以完美調試運行。

React Native 環境搭建攻略