Windows10下搭建ReactNative開發環境
前言
最近花了很多時間在研究ReactNative，在網上參考了很多的資料如何來搭建ReactNative開發環境，但是總是無法在windows10系統下搭建成功，幾經周折，最後終於完成了環境的搭建，因此記錄下來
需要安裝的軟體
1、nodejs
2、git
3、android sdk
4、Windows10 SDK （這個是很多教程上沒有的環境，因此可能會報很多莫名奇妙的編譯錯誤）
5、C++ builder tools
根據上面的軟體要求我們一步步的來進行ReactNative開發環境的搭建
安裝nodejs
版本：官網最新stable版本，我這裡是4.45
安裝步驟：根據msi檔案的安裝提示一步步的完成
執行：在cmd中輸入node -v，可以看到如下的效果
安裝git
版本：官網最新版本
安裝步驟：根據下載的exe檔案一步步的提示進行安裝完成
執行：在cmd中輸入git，可以看到如下的效果
安裝android sdk
第一步，軟體下載
版本：我這裡採用的android studio的sdk，所以我本機直接安裝的androidStudio，具體的可以根據實際情況去下載SDK
第二步、安裝
安裝過程和普通的exe差不多
第三步、設定環境變數
a、開啟環境變數位置：控制面板 -》系統和安裝 -》系統 -》高階系統設定，最後調出的環境變數的配置位置，如下圖
b、設定環境變數
新建環境變數:ANDROID_HOME，變數的值填入sdk的路徑，我這裡是D:\AndroidStudio\sdk\，如下圖所示
修改path變數，並將android sdk的tools工具增加到PATH變數中，最後結果如下圖
c、檢測android sdk ，在cmd下輸入adb如果有如下的提示，說明環境變數配置成功
安裝Windows10 SDK
安裝步驟：根據sdk的安裝提示一步步的進行安裝
安裝C++ builder Tools
安裝步驟：根據sdk的安裝提示一步步的進行安裝
ReactNative實踐
至此，所有的必要的軟體都已經安裝完畢，接下來要進行下一步的操作，如何來建立一個ReactNative
第一步，安裝React-native-cli
因為受國內網路的限制，這裡設定npm的映象地址為淘寶，操作步驟如下
a、設定register
依次在cmd中執行如下命令
npm config set registry https://registry.npm.taobao.org npm config set disturl https://npm.taobao.org/dist
b、全域性React-native-cli
在cmd中執行如下命令：
npm install -g react-native-cli
這個過程需要較長的時間，等待命令執行完畢
第二步、建立一個新的專案
在cmd下執行命令
npm init wenda
這個過程需要等待很長的時間，如果在init的過程中報錯，請仔細核對上面必須要安裝的軟體是否成功安裝,成功之後會出現如下介面
第三步、執行專案
a、啟動js bundle服務
進入到MyProject所在的目錄，在cmd下執行命令,效果圖如下圖所示
react-native start
b、啟動應用
重新開啟一個cmd，切換到MyProject目錄，然後執行如下命令，等待一段時間的編譯和打包，成功之後會出現如下介面，這裡注意的是，你首先需要將手機連線到電腦上，否則可能會出現cannot find device
react-native run-android
注意：
編譯的過程由於會下載gradle，所以過程會比較慢，這裡更快的解決方法是採用離線的方式，
2、然後更改gradle配置檔案
路徑為：d/develop/languages/ReactNative/wenda/android/gradle/wrapper/gradle-wrapper.properties中的這段程式碼
distributionUrl= https://services.gradle.org/distributions/gradle-2.4-all.zip
改為
distributionUrl=file:///d:/develop/languages/ReactNative/wenda/gradle-2.4-all.zip
c、執行效果
第一次啟動肯定會是如下的結果，原因是因為手機無法找到電腦上的代理
接下來使用ipconfig命令檢視下電腦的ip地址，並將該地址設定為手機的代理，步驟如下
1）搖一搖手機，出現選單，如下面左邊的圖所示，點選DevSetting設定，出現設定的介面，如下面右邊的圖所示
2）設定代理為本機對應的ip，如我本機的地址192.168.3.51，埠為8081，則下面的地址為192.168.3.51:8080
3）回退到空白的介面，接著搖一搖手機出現選單，如下圖左邊所示，先擇Reload JS，然後會出現成功的頁面，如下圖右邊所示
4）到此所有的步驟均已經完成
安裝過程中遇到的問題
參考連結
windows安裝ReactNative環境
http://www.tuicool.com/articles/26byiuZ
解決node-gyp編譯錯誤的問題
https://github.com/nodejs/node-gyp/issues/802