React Native Elements开发环境 & 生成项目 & 虚拟机调试 & 本地生成APK档 & 虚拟机运行APK档

1.0 開發環境

?

1 2 3 4

java -version java version "11.0.11" 2021-04-20 LTS Java(TM) SE Runtime Environment 18.9 (build 11.0.11+9-LTS-194) Java HotSpot(TM) 64-Bit Server VM 18.9 (build 11.0.11+9-LTS-194, mixed mode)

　　JDK 11.0.11

 

?

1 2	node -v v14.16.1

　　Node 14.16.1

 

visual studio installer - node development & desktop development with C++

 

必需高於API 31版本，否則不支援React Native。

 

?

1 2 3 4

adb version Android Debug Bridge version 1.0.41 Version 31.0.2-7242960 Installed as C:\Users\Kennychan\AppData\Local\Android\Sdk\platform-tools\adb.exe

　　adb 31.0.2-7242960

 

 

 

ANDROID_HOME: 安裝android studio時會自動加入。
JAVE_HOME: 可切換JDK版本。
Path -> platform-tools: adb的根目錄。

 

2.0 生成项目

RN Elements官方推薦使用Expo CLI云開發，但我建議本地開發，所以還是使用create-react-native-app腳手架。

?

1	npx create-react-native-app reactnative001

　　腳手架生成目錄。

?

1 2 3 4

npm i @rneui/themed npm i --save react-native-vector-icons npm i react-native-safe-area-context npm i @rneui/themed @rneui/base

　　安裝packages。

 

3.0 虚拟机调试

  

運行虚拟机。

 

?

1 2 3

adb devices -l List of devices attached emulator-5554          device product:sdk_gphone64_x86_64 model:sdk_gphone64_x86_64 device:emulator64_x86_64_arm64 transport_id:2

　　成功運行虚拟机-5554。

 

?

1	npm run android

　　運行項目。

 

4.0 本地生成APK档

?

1	npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

　　生成android目錄。

 

手動新增folder: %PEOJECT_ROOT%\android\app\src\main\assets。如果沒圖片，就不會有這assets目錄，引致報錯。

?

1	cd android && gradlew assembleDebug && adb install %PROJECT_ROOT%\android\app\build\outputs\apk\debug\app-debug.apk

　　本地生成APK档

 

5.0 虚拟机運行APK档

?

1	adb install %PROJECT_ROOT%\android\app\build\outputs\apk\debug\app-debug.apk

　　虚拟机運行APK档