1. 下載node

下載地址 https://nodejs.org/en/
下載之后直接雙擊安裝

image.png

需要注意的是硫眯，node官網(wǎng)往往會(huì)給出兩個(gè)默認(rèn)的版本，一般左邊的穩(wěn)定版择同，后邊的是最新版（先選用穩(wěn)定版）

測試node是否安裝成功的方法：

打開cmd命令工具两入，輸入node -v 如果出現(xiàn)下圖所示則表示成功

image.png

2. 設(shè)置鏡像的下載地址

因?yàn)榈谝徊揭呀?jīng)成功安裝完了node，現(xiàn)在直接打開cmd命令行敲才，分別輸入以下命令：

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

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

3.下載Python2

版本必須是2.x 不支持3.x裹纳，JDK的版本必須是1.8 目前不支持1.9或更高版本
下載地址：
https://www.python.org/downloads/release/python-2715/

image.png

安裝時(shí)， 注意勾選 Add python.exe to Path,選項(xiàng)紧武，這樣就可以在安裝完成后剃氧，不用手動(dòng)去添加環(huán)境變量。

image.png

安裝完阻星，打開cmd.exe,輸入python,然后enter,如果能成功返回ptython的版本號(hào)等信息朋鞍，則說明安裝成功。

4.安裝React Native命令行工具（react-native-cli）

打開cmd命令行鍵入以下命令妥箕。
npm install -g yarn react-native-cli

image.png

安裝成功后的樣子
（yarn是facebook提供的替代npm的工具滥酥，可以加速node模塊的下載。ReactNative的命令行工具用于執(zhí)行創(chuàng)建矾踱，初始化恨狈，更新項(xiàng)目，運(yùn)行打包服務(wù)等任務(wù)）

安裝完成后呛讲，同理設(shè)置一樣鏡像源
yarn config set registry https://registry.npm.taobao.org --global
yarn config set disturl https://npm.taobao.org/dist --global

image.png

成功后的樣子

5. 這些環(huán)境如果已經(jīng)安裝過可以跳過

a.安裝jdk
需要jdk1.8以上版本,具體安裝教程：http://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html
安裝完成之后禾怠，打開cmd.exe,輸入
java -version
如果成功返回版本信息返奉，則說明安裝成功。

b.配置ANDROID_HOME環(huán)境變量

image.png

新建系統(tǒng)環(huán)境變量吗氏，填寫android sdk的安裝目錄

c.檢查android studio的sdkmanager是否有東西沒有安裝芽偏，目前編譯RN應(yīng)用需要android8.1版本的sdk，要確保已經(jīng)安裝弦讽，另外要確保android8.1下面的android sdk platform 27以及Intelx86 Atom_64 System Image也安裝了

image.png

6.創(chuàng)建新的RN項(xiàng)目

硬盤上新建文件夾污尉，然后打開cmd.exe,切換到該目錄，然后執(zhí)行
react-native init 項(xiàng)目名
這個(gè)過程可能會(huì)耗費(fèi)一段時(shí)間往产，請(qǐng)耐心等待被碗，初始化完成之后，切換到新建的項(xiàng)目文件夾中仿村，然后執(zhí)行(執(zhí)行之前記得檢查好虛擬機(jī)或者手機(jī)是否已經(jīng)處于調(diào)試模式锐朴，不要同時(shí)連接多臺(tái)虛擬機(jī)或手機(jī))
react-native run-android
等待編譯完成(第一次編譯可能會(huì)很慢），直到在android的虛擬機(jī)上出現(xiàn) WelCome to react-native,則大功告成蔼囊，修改index.js,保存之后焚志，在鼠標(biāo)移動(dòng)到虛擬機(jī)上，然后點(diǎn)擊兩次鍵盤R,就會(huì)觸發(fā)新代碼更新到虛擬機(jī)畏鼓。（真機(jī)的話搖一搖）

image.png

運(yùn)行之后可能出現(xiàn)的錯(cuò)誤：
1.react native skipping device for app:debug:unknown api level
安裝不成功酱酬，扯掉數(shù)據(jù)線，重新連接云矫，重新打開調(diào)試模式（多試幾次）

2.錯(cuò)誤1：unable to load script from assets ‘index.android bundle’ ,make sure your bundle is packaged correctly or youu’re runing a packager server
手機(jī)滿屏紅
在cmd命令行中 先切換到項(xiàng)目的目錄 然后運(yùn)行如下圖中的命令：
或者在android studio的Terminal中鍵入：

image.png

再重新運(yùn)行一次 react-native run-android
3.如果有同學(xué)的adb無法被識(shí)別為命令膳沽，即：adb不是內(nèi)部或外部命令 也不是可運(yùn)行程序
找到android sdk platform-tools所在目錄，并將其加入PATH路徑

4.如果編譯運(yùn)行過程中出現(xiàn)了 提示找不到SDK路徑的錯(cuò)誤

image.png

解決辦法：1.檢查環(huán)境變量里的android_home和path里的路徑地址是否正確泼差；
2.在rn項(xiàng)目android文件夾下贵少，新建local.properties，并且在文件中寫入SDK的路徑
如我的路徑是：sdk.dir=C:\myspace\Android_SDK