RN(react native)入坑指南-03,運(yùn)行官方示例UIExplorer

學(xué)習(xí)RN,官方示例是必不可少的,研究和學(xué)習(xí)官方示例會(huì)帶來許多幫助。
在搭建好rn環(huán)境之后就可以著手嘗試運(yùn)行官方示例來看下RN的各類組件了。

先決條件

  • node
  • npm
  • RN
  • Git
  • Gradle
  • ADK/SDK

開始

首先下載RN代碼
Github: https://github.com/facebook/react-native
下載成功后 命令行切換到目標(biāo)目錄 執(zhí)行npm install安裝所需依賴

配置*DK

這里有兩種方式
法1:
  切換到react-native目錄, 新建local.properties

sdk.dir=absolute_path_to_android_sdk
ndk.dir=absolute_path_to_android_ndk

法2:
  環(huán)境變量添加ANDROID_NDK,ANDROID_SDK分別指向NDK和SDK的目錄
更多說明請(qǐng)參考 關(guān)于SDK/NDK配置的官方文檔

真機(jī)測(cè)試

如果是windows小伙伴,下面的命令建議用安裝完git后自帶的gitbash運(yùn)行

1.執(zhí)行命令

./gradlew :ReactAndroid:assembleDebug

2.然后執(zhí)行

./gradlew :ReactAndroid:installArchives

3.啟動(dòng)服務(wù)

./packager/packager.sh

4.最后安裝到你的手機(jī)

../gradlew :Examples:UIExplorer:android:app:installDebug

這個(gè)過程中請(qǐng)不要隨意關(guān)閉packager運(yùn)行窗口
5.設(shè)置ip
現(xiàn)在,打開UIExplorer項(xiàng)目,搖一搖你的手機(jī),在彈出的菜單中選擇Dev settings->Debug server host & port for device
設(shè)置一下你的無線IP 比如192.168.1.1:8081,注意:此處的8081一定要有的否則無法加載

更多內(nèi)容請(qǐng)參考官方的真機(jī)調(diào)試文檔

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,030評(píng)論 25 709
  • RN嵌入app所踩的坑 本篇文章不會(huì)包括RN中的相關(guān)概念,生命周期等內(nèi)容,只包括在接入過程中所遇到的一些問題,接入...
    yftx_閱讀 5,805評(píng)論 3 4
  • 盡管在移動(dòng)開發(fā)中,原生APP的開發(fā)成本很高,但現(xiàn)階段基于原生開發(fā)仍然是必須的,因?yàn)閃eb的用戶體驗(yàn)仍無法超越Nat...
    奔跑的大橙子閱讀 5,481評(píng)論 0 11
  • 總覺得夜有特別的魔力,不是不困是不想睡,曾經(jīng)三天三夜沒睡,后來怎么睡著的都忘了,一個(gè)人跑步看著天空,這里找不到星星...
    山北的木閱讀 231評(píng)論 0 0
  • 一天中午,我吃完了午飯,到小區(qū)里玩耍。忽然我看見了一個(gè)螞蟻。于是,我問他身上扔了一塊吃的,它用觸角碰了碰,然后走開...
    徐家匯站閱讀 369評(píng)論 0 0

友情鏈接更多精彩內(nèi)容