react native新建專案執行在安卓裝置上
一、
二、
1、新建(不含android和ios包的)專案:在終端輸入 npm install -g create-react-native-app和create-react-native-app AwesomeProject即可新建一個名為AwesomeProject的專案。
2、在終端切換到專案根目錄下(如cd AwesomeProject),開啟服務npm start,根據提示選擇執行到android手機上。
3、此時手機上會安裝上一個名為Expo的app,終端上會顯示一個二維碼,使用Expo掃描二維碼即可進行除錯。
三、
1、新建(含android和ios包的)專案:在終端輸入react-native init AwesomeProject即可新建一個名為AwesomeProject的專案。
2、從你電腦上的其他安卓專案中複製local.properties檔案到專案對應的android包下。
3、在終端切換到專案根目錄(如cd AwesomeProject),開啟服務同時react-native run-android執行專案到android手機上(windows下需要先開啟服務npm start)。
四、
1、通過Android Studio新建Android專案。
2、a、在原生 Android 專案的在app/build.gradle檔案中,新增React Native依賴:compile"com.facebook.react:react-native:+
b、加入.so 庫ndk {
abiFilters "armeabi-v7a", "x86"
}
c、在工程目錄下找到工程的 build.gradle檔案中,新增 maven依賴
allprojects {
repositories {
jcenter()
maven {
// All of React Native (JS, Android binaries) is installed from npm
url "$rootDir/node_modules/react-native/android"
}
}
}
d、在 app 目錄裡新增需要的許可權e、新增 FaceBook 的 ReactNative 除錯的 activity<uses-permission android:name="android.permission.INTERNET"/> <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity"/>
3、在專案根目錄使用npm init命令建立package.json,同時在生成的package.json檔案的scripts中新增
"start": "node node_modules/react-native/local-cli/cli.js start"
4、使用npm install -save react,npm install -save react-native下載原始檔
5、你也可以使用curl -o .flowconfig https://raw.githubusercontent.com/facebook/react-native/master/.flowconfig
在android根目錄下生成.flowconfig檔案作用於flow主要用來做靜態程式碼檢查。
6、參照上面兩種方式生成的專案來填寫你的AndroidManifest.xml、你的react-native入口activity、你的application還有index.android.js。
1、The development server returned response error code: 500
這個錯誤可能是 babel-preset-react-native庫版本不對應,需要在終端輸入npm uninstall babel-preset-react-native
npm install [email protected]
2、
(Android 5.0及以上)使用adb reverse命令
注意,這個選項只能在5.0以上版本(API 21+)的安卓裝置上使用。
首先把你的裝置通過USB資料線連線到電腦上,並開啟USB除錯(關於如何開啟USB除錯,參見上面的章節)。
執行adb reverse tcp:8081 tcp:8081
不需要更多配置,你就可以使用Reload JS和其它的開發選項了。
3、搖晃手機,或者執行adb shell input keyevent 82,可以調出開發者選單。