React-Native項(xiàng)目在Android真機(jī)上調(diào)試
React-Native項(xiàng)目在Android真機(jī)上調(diào)試镜雨?接下來(lái)直奔主題嫂侍,通過(guò)USB將手機(jī)和電腦連接,打開(kāi)手機(jī)上的USB調(diào)試冷离。不通型號(hào)的手機(jī)可能設(shè)置方式不一樣吵冒,這里具體不在細(xì)說(shuō)……
1、確保你的設(shè)備已經(jīng)成功連接西剥”云埽可以終端輸入adb devices來(lái)查看:
$ adb devices
List of devices attached
"Your device Name" device
注意:為避免調(diào)試出現(xiàn)其他問(wèn)題,此處只需有一臺(tái)設(shè)備連接瞭空,如果模擬器打開(kāi)需要關(guān)閉模擬器揪阿;
2、終端運(yùn)行npm start 開(kāi)啟本地服務(wù)(yarn react-native start)咆畏,成功后運(yùn)行react-native run-android來(lái)在設(shè)備上安裝并啟動(dòng)應(yīng)用南捂,或者VSCode等編輯器進(jìn)行Debug Android
應(yīng)用成果安裝后不出意外的話(huà)會(huì)提示無(wú)法連接服務(wù)器,如下圖:
出現(xiàn)此問(wèn)題是因?yàn)槲覀兾唇o手機(jī)設(shè)置訪問(wèn)開(kāi)發(fā)服務(wù)地旧找,模擬器是直接訪問(wèn)電腦本地服務(wù)溺健,真機(jī)則需要我們手動(dòng)配置了
3、設(shè)置設(shè)備訪問(wèn)開(kāi)發(fā)服務(wù)器
一钮蛛、(Android 5.0及以上)使用adb reverse命令
1鞭缭、運(yùn)行adb reverse tcp:8081 tcp:8081
2、不需要更多配置魏颓,你就可以使用Reload JS和其它的開(kāi)發(fā)選項(xiàng)了岭辣。
二、(Android 5.0以下)通過(guò)Wi-Fi連接你的本地開(kāi)發(fā)服務(wù)器
1甸饱、首先確保你的電腦和手機(jī)設(shè)備在同一個(gè)Wi-Fi環(huán)境下沦童。
2、在設(shè)備上運(yùn)行你的React Native應(yīng)用叹话。和打開(kāi)其它App一樣操作偷遗。
3、你應(yīng)該會(huì)看到一個(gè)“紅屏”錯(cuò)誤提示渣刷。這是正常的鹦肿,下面的步驟會(huì)解決這個(gè)報(bào)錯(cuò)。
4辅柴、搖晃設(shè)備箩溃,或者運(yùn)行adb shell input keyevent 82瞭吃,可以打開(kāi)開(kāi)發(fā)者菜單。
5涣旨、點(diǎn)擊進(jìn)入Dev Settings歪架。
6、點(diǎn)擊Debug server host for device霹陡。
7和蚪、輸入你電腦的IP地址和端口號(hào)(電腦網(wǎng)絡(luò)IP:8081)。查看電腦IP這里就不用多說(shuō)啦烹棉。
8攒霹、回到開(kāi)發(fā)者菜單然后選擇Reload JS。
備注:理想狀態(tài)下已經(jīng)可以看到APP頁(yè)面了浆洗,但是催束,如果上面步驟都已經(jīng)做好,并且電腦本地服務(wù)終端已顯示加載成功伏社,但是APP的頁(yè)面還未加載出來(lái)抠刺,顯示白屏狀態(tài)!是我們的步驟有問(wèn)題摘昌?這里并不是我們的步驟有問(wèn)題速妖,此時(shí)只需要退出正在運(yùn)行的APP,重新打開(kāi)即可聪黎,就可以成功加載到APP頁(yè)面啦罕容!