前言

公司的项目用到了React Native，最近通过后台监控到一些崩溃问题，主要出在React Native Java侧的源码中，由于无法在js侧去定位和修复问题，于是希望通过修改React Native源码达到规避Crash的目的，下面记录编译React Native源码的过程。

注：本文所有流程仅在macOS下测试通过，未在Linux和Windows下测试

准备工作

下载RN源码

首先需要准备一份React Native的源码，由于我们的项目中使用的是0.66.3的版本，于是我直接在github上下载了一份源码zip包，可以进入React Native在GitHub上的主页
https://github.com/facebook/react-native
切到0.66.3这个tag，然后点击Code – Download Zip来下载，当然你也可以直接git clone整个代码仓库然后使用下面的命令基于v0.66.3这个tag切个新分支出来：git checkout -b v0.66.3 v0.66.3

创建一个空的RN项目

使用下面的命令来创建一个新的RN项目：

npx react-native init AwesomeProject --version 0.66.3

这里需要注意使用–version参数来指定使用的RN版本，确保版本统一。
使用npx命令创建RN项目后，会自动安装相关依赖，在AwesomeProject/node_modules目录下，也会有一份RN源码的目录，名称为react-native，但是我们的目的是为了直接通过RN源码去编译整个项目，所以不能直接用这个react-native目录，而是需要将上一步中下载好的源码全部拷贝到node_modules目录下，覆盖react-native目录。

修改Android项目配置

这一步我们需要修改上一步中创建的空RN项目中的Android配置，咱们一步一步来做修改，首先是AwesomeProject/android/build.gradle文件的修改，需要加入如下两个配置：

// Top-level build file where you can add configuration options common to all sub-projects/modules.buildscript {ext {buildToolsVersion = "30.0.2"minSdkVersion = 21compileSdkVersion = 30targetSdkVersion = 30ndkVersion = "21.4.7075529"}repositories {google()mavenCentral()}dependencies {classpath("com.android.tools.build:gradle:4.2.2")// NOTE: Do not place your application dependencies here; they belong// in the individual module build.gradle filesclasspath 'com.tencent.bugly:symtabfileuploader:2.2.1'classpath 'de.undercouch:gradle-download-task:5.0.1' // (1)添加这行代码}
}allprojects {repositories {mavenCentral()mavenLocal()maven {// All of React Native (JS, Obj-C sources, Android binaries) is installed from npmurl("$rootDir/../node_modules/react-native/android")}maven {// Android JSC is installed from npmurl("$rootDir/../node_modules/jsc-android/dist")}google()maven { url 'https://www.jitpack.io' }maven {url 'http://nexus.d.xiaomi.net/nexus/content/groups/public'}}// (2) 添加如下配置configurations.all {resolutionStrategy {dependencySubstitution {substitute module("com.facebook.react:react-native:+") with project(":ReactAndroid")}}}
}

然后打开AwesomeProject/android/settings.gradle文件，在文件开始处添加如下配置：

pluginManagement {repositories {gradlePluginPortal()mavenLocal()google()}
}

在该文件的末尾处添加如下配置：

include ':ReactAndroid'
project(':ReactAndroid').projectDir = new File(rootProject.projectDir, '../node_modules/react-native/ReactAndroid')include(":packages:react-native-codegen:android")
project(":packages:react-native-codegen:android").projectDir = new File(rootProject.projectDir,"../node_modules/react-native/packages/react-native-codegen/android")includeBuild("../node_modules/react-native/packages/react-native-codegen/android")includeBuild('../node_modules/react-native/packages/react-native-gradle-plugin')

接着需要修改AwesomeProject/android/app/build.gradle文件，将之前的

implementation "com.facebook.react:react-native:+"

修改为：

implementation project(':ReactAndroid')

由于React Native源码中有一部分c代码，需要配置Android NDK参与编译，故还需要做Android NDK的一些配置，主要是在AwesomeProject/android/gradle.properties文件中添加如下两个配置：

ANDROID_NDK_VERSION=21.4.7075529
ANDROID_NDK_PATH=/Users/yubo/Library/Android/sdk/ndk/21.4.7075529

ANDROID_NDK_VERSION指定了NDK的版本，ANDROID_NDK_PATH指定了NDK所在路径，如果不知道NDK怎么下载，可以通过Android Studio打开AwesomeProject/android目录，然后在Android Studio – Preferences…菜单中，选择对应的NDK下载即可，如下图所示：

编译项目

做完了如上几步配置后，就可以开始编译项目了，直接使用下面的命令即可：

cd AwesomeProject/android && ./gradlew clean assebleDebug

上面的命令主要是打Android debug包，当然你也可以直接在AwesomeProject根目录执行npm run android，如果配置没有问题，将会开始使用RN源码参与Android的编译打包流程，这一步在我的Macbook M1上会跑大约8分钟左右，第一次编译的时间会稍微有些长，待第一次编译成功后有了缓存，下次编译时间就很快了。

由于我的笔记本是M1芯片的Macbook Pro，在编译过程中出现错误，搜索了一番后，解决方案如下：
拷贝了一份ndk目录下的ndk-build文件，修改其内容如下：
#!/bin/sh
DIR="$(cd "$(dirname "$0")" && pwd)"
arch -x86_64 /bin/bash $DIR/build/ndk-build "$@"

打包aar

如果直接在项目中依赖RN的源码，不是一个很好的选择，更好的方式是将RN源码编译打包为一个aar文件，然后在Android项目中使用，打包aar的命令如下：

./gradlew :ReactAndroid:installArchives --no-daemon

注意这个命令需要在RN项目的android目录下执行，执行完毕后，会在node_modules/react-native/android/com/facebook/react/react-native目录下，生成对应的文件，其中就有aar文件，我们可以直接拷贝aar文件到Android项目中去依赖，也可以上传对应的编译产物到maven，通过maven在Android项目中去依赖

后记

编译RN源码花了一些时间，主要是完全按照官方文档来，绕了一些弯，最后还是自己慢慢尝试才编译成功，关于官方文档上的编译步骤，可以参考这里：
https://github.com/facebook/react-native/wiki/Building-from-source

使用React Native源码编译Android项目相关推荐

java jni编译_从源码编译Android系统的Java类库和JNI动态库的方法
利用源码编译Android系统Java类库 1.编写Java项目和Android.mk文件 ├── Android.mk └── src └── com └── lhw └── framework └ ...
React Native 源码分析（三）——Native View创建流程
1.React Native 源码分析(一)-- 启动流程 2.React Native 源码分析(二)-- 通信机制 3.React Native 源码分析(三)-- Native View创建流程 ...
源码编译SSH项目问题记录
源码编译spring2.5.6+Hibernate3.2.5ga+ structs2.1.8在 Apache Tomcat/5.5.25的部署, JDK1.5环境下编译,IDE工具MyEclipse8 ...
android 4.4 源码编译,Android 4.4源码编译过程
Android源码下载完后的目录如下: 整个代码的大小为:25.559GB. 一.构建系统如下用于构建Android源码树的指令应用于所有的代码分支,包括master分支.喎?http://www. ...
Android源码编译Android Studio(带jar和jni)工程
1.把android studio工程删除到如下目录, 注意:如果在此目录下,有libs和jni目录 # cp -rf jni app/src/main # cp -rf libs app/src/m ...
rk3288编译android,RK3288 源码编译Android 7.1.2 自动编译
接着上一篇文章,我们写一个shell脚本. 实现自动编译. #/bin/bash #Test for auto compile Android7.1.2 source code echo " ...
【Android Gradle】安卓应用构建流程 ( Java 源码编译和 AIDL 文件编译 )
文章目录一.安卓应用构建简介二.Java 源码编译三.AIDL 源码编译一.安卓应用构建简介使用 Android Studio 开发 Android 应用时 , 编译应用后在 Module ...
【CMake】CMake 引入 ( Android Studio 创建 Native C++ 工程 | C/C++ 源码编译过程 | Makefile 工具 | CMake 引入 )
文章目录一.在 Android Studio 中创建 Native C++ 工程二.C/C++ 源码编译过程三.Makefile 工具四.CMake 引入该系列博客的应用场景是 Androi ...
【Android 逆向】Android 进程注入工具开发 ( 总结 | 源码编译 | 逆向环境搭建使用 | 使用进程注入工具进行逆向操作 ) ★★★
文章目录一.Android 进程注入工具开发系列博客二.Android 进程注入工具源码下载编译三.逆向环境搭建四.使用注入工具进行逆向操作 1.获取远程进程号 2.注入工具准备 3.注入动 ...
android编译.a文件,Android 7.1源码编译导入AS完整教程
本教程仅针对Android 7.1系统,为便于虚拟机备份和出现问题时的还原,本教程分为3步:初始化编译环境.源码同步.编译源码导入Android Studio. 编译源码:Android7.1.2_r ...

使用React Native源码编译Android项目

前言