电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛

标题: RN 集成到Android步骤（1） [打印本页]

作者: look_w 时间: 2019-3-4 20:39 标题: RN 集成到Android步骤（1）

RN虽可以独立打成apk包作为独立应用，但目前更多情形是将其嵌入Native中。本文记录如何将RN集成到android(需要了解一点android知识噢)
1、新建Android Studio 工程为AndroidRnDemo

1、在根目录AndroidRnDemo下执行npm init 建立package.json并安装react react-native的依赖

npm init
npm install --save react react-native

2、修改package.json的scripts字段，新增start

"scripts": {
      "test": "echo \"Error: no test specified\" && exit 1",
      "start": "node node_modules/react-native/local-cli/cli.js start"
},

2、将ReactNative添加到Android项目

1、配置app目录下的build.gradle：

dependencies {
      implementation fileTree(dir: 'libs', include: ['*.jar'])
      implementation 'com.android.support:appcompat-v7:26.1.0'
      implementation 'com.android.support.constraint:constraint-layout:1.0.2'
      api "com.facebook.react:react-native:+"    //将RN相关库添加至Android依赖
      testImplementation 'junit:junit:4.12'
      androidTestImplementation 'com.android.support.test:runner:1.0.1'
      androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.1'
}

2、配置根目录下的build.gradle：

allprojects {
      repositories {
         google()
         maven {
            url "$rootDir/node_modules/react-native/android"
         }
         jcenter()

      }
}

3、配置Android-Manifest.xml，添加权限

/**设置调试的权限**/
<uses-permission android:name="android.permission.INTERNET" />    // 网络权限
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
<uses-permission android:name="android.permission.SYSTEM_OVERLAY_WINDOW" />
// 添加debug模式Activity(正式打包注释掉就好了,activity要放在application内)
<activity android:name="com.facebook.react.devsupport.DevSettingsActivity"/>

欢迎光临电子技术论坛_中国专业的电子工程师学习交流社区-中电网技术论坛 (http://bbs.eccn.com/)