1. 程式人生 > >React-Native android在windows下的踩坑記

React-Native android在windows下的踩坑記

坑很多,跳之前做好準備。沒有VPN的同學請瀏覽完本文後慎行。

你需要先安裝最新版本的node.js(我最後使用的是v4.1.2),前往官網下載>>

注:我win7已經安裝過Visual Studio 2013和Android開發環境(也踩了不少坑,後面有截圖)

為了方便切換npm源,需要先安裝nrm模組

因為公司內把taobao全線遮蔽了,所以我用了cnpm的映象

因為我之前電腦裡安裝了node的v0.12.7版本,所以我遇到了下面的坑

如果你也跟我一樣啟動的時候報錯了,那麼你需要升級node.js,直接到官網下載並安裝,安裝路徑覆蓋現有安裝目錄即可。官網上也提到node的最低版本要求

更新完node後

保留packager的dos視窗,新建另外一個dos視窗,切換至專案目錄下:react-native run-android

報錯了,你需要設定ANDROID_HOME的環境變數,跟JAVA_HOME類似的,這裡直接略過了…

遇到這個錯誤,我是被坑了很久,說下過程。我嘗試下載並安裝Android Studio。 啟動Android Studio後報錯了

最後啟動Android Studio後,開啟SDK Manager,設定映象後,下載安裝指定的SDK,引數下面這篇文章:

一切就緒,再次執行時遇到了這個問題

此時你需要開啟VPN,靜靜等待好訊息吧…

.babelrc”檔案刪除,否則這個頁面打不開。瀏覽器能正常訪問但手機訪問時在packager的DOS視窗沒有看到log輸出,那麼你可以嘗試使用下面的命令:

最後的最後,期待已久的介面出來了。

修改文字,然後重新載入JS,應用不需要重啟,效果如下:

總體來說,按照網上的資料你是能一步一步解決問題的。我遇到的問題跟我之前安裝的環境有問題,所以導致了一些問題,祝諸君都能順利看到Welcome to React Native!介面