React Native For Android 源码编译

803 查看

来分享一下编译 React Native Android 所遇到的一些坑。

编译需求

项目初步试水React Native中，第一个紧要问题就是如何将项目引入到 Native项目中。
主流的方法可能就是按官方的做法，引入react native的依赖包.
但这样会存在几个问题:

  • 引入React Native后，项目增大了7M ，所以我们需要精简包
  • React Native 的包结构目录包括了 android的工程目录的，所以android得工程目录能引用到node_module目录，但成型的项目包结构已经固定，就是android目录直接存放在git上了。所以 我们需要切断Android与node_modules的耦合。

编译后给项目带来的好处

  • APK 包只增加了5M
  • 更好地将React Native融入到现有的项目

编译

官方给出的方式是这样的

npm install --save github:facebook/react-native#master

反正我是通过这种方式下载不了的。

导入ReactAndroid

还好在node_modules目录下就已经存在了一个ReactAndroid目录，使用Android Studio ，通过import Modules找到node_modules/react-native/ReactAndroid文件夹引入源码.

移动ReactCommon 文件夹

再导入后，你还需要将node_modules/react-native/ReactCommon文件夹也移动到 项目的ReactAndroid目录下，这样ReactAndroid就彻底解耦了.

修改ReactCommon 在项目中的地址



找到ReactAndroid的build.gradle文件，找到ReactCommon所在的地方,更换ReactCommon的地址为:

"REACT_COMMON_DIR=$projectDir/ReactCommon",

将ReactAndroid 作为类库调用

在项目的入口module的build.gradle中加入

 compile project(':ReactAndroid')

可能遇到的问题

NDK 报错

Error:Execution failed for task buildReactNdkLib

遇到这个问题，先看NDK环境是否配置好，在Android Studio的File功能栏中找到Project Structure，看看是否填好了Android NDK Location.

如果已经填入，请确定是否装的是 NDK-r10e版本，如果填入了别的版本，也是编译不了。
该NDK版本可以从官方下载: http://facebook.github.io/react-native/docs/android-building-from-source.html

下载好后，在Project Structure中指定就好了.

示例:


build 很慢

然后Android Studio 就会一直在build,运气好一点，十分钟就结束了，运气不好，可能永远都停不下来了。


这个时候，你需要找到ReactAndroid的build.gradle文件。

在这里面有多个下载的地址，所以build都是进行下载。
boost_1_57_0.zip 这个压缩包是最大的，最好用http://mirror.nienbo.com/boost/boost_1_57_0.zip这个地址替换https://downloads.sourceforge.net/project/boost/boost/1.57.0/boost_1_57_0.zip就会快很多。

PS: 万一build停不下来，你就只能强制退出Android Studio，然后再开启，修改地址后再build.

找不到so文件

java.lang.UnsatisfiedLinkError: could find DSO to load: libreactnativejni.so

遇到这种情况，首先应该尝试 重新编译Rebuild
编译不通过，则需要检查 应用的build.gradle。标准的文件应该是这样的:

apply plugin: 'com.android.application'
apply from: "../react.gradle"

def enableSeparateBuildPerCPUArchitecture = false
def enableProguardInReleaseBuilds = false

android {
    compileSdkVersion 24
    buildToolsVersion "24.0.1"

    defaultConfig {
        applicationId "com.example.testreact"
        minSdkVersion 16
        targetSdkVersion 24
        versionCode 1
        versionName "1.0"
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
    }
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86"
        }
    }
    // applicationVariants are e.g. debug, release
    applicationVariants.all { variant ->
        variant.outputs.each { output ->
            // For each separate APK per architecture, set a unique version code as described here:
            // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
            def versionCodes = ["armeabi-v7a":1, "x86":2]
            def abi = output.getFilter(com.android.build.OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
        }
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    testCompile 'junit:junit:4.12'
    compile 'com.android.support:appcompat-v7:24.1.1'
    compile project(':ReactAndroid')
}

clean与build 问题

我们都知道，在Android 在执行clean操作后，build文件夹下的文件将会被清除。但上面讲到，在ReactAndroid的项目中，它会把文件下载到build/download文件下，我们应该防止每次都需要重新下载.

首先，将ReactAndroid/build/react-ndk 文件夹移动到ReactAndroid项目下，
再找到 ReactAndroid下的build.gradle,里面有个sourceSets.main ,将第二行修改成这样

jniLibs.srcDir "react-ndk/exported"

这样，jni的文件夹就被移动到ReactAndroid的项目下了，而不会每次打包都需要下载。而且可以直接上传到git,别人再下载该项目就不用 下载文件了。

PS: clean 操作还会报 Android.mk Stop 的错误，删除

clean.dependsOn cleanReactNdkLib

这一行就好了.

本人的ReactAndroid目录下build.grald

// Copyright 2015-present Facebook. All Rights Reserved.

apply plugin: 'com.android.library'
apply plugin: 'maven'

android {
    compileSdkVersion 23
    buildToolsVersion "23.0.1"

    defaultConfig {
        minSdkVersion 16
        targetSdkVersion 22
        versionCode 1
        versionName "1.0"

        ndk {
            moduleName "reactnativejni"
        }

        buildConfigField 'boolean', 'IS_INTERNAL_BUILD', 'false'
        buildConfigField 'int', 'EXOPACKAGE_FLAGS', '0'
        testApplicationId "com.facebook.react.tests.gradle"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }

    sourceSets.main {
        jni.srcDirs = []
        jniLibs.srcDir "react-ndk/exported"
        res.srcDirs = ['src/main/res/devsupport', 'src/main/res/shell', 'src/main/res/views/modal']
        java {
          srcDirs = ['src/main/java', 'src/main/libraries/soloader/java', 'src/main/jni/first-party/fb/jni/java']
          exclude 'com/facebook/react/processing'
        }
    }

    lintOptions {
        abortOnError false
    }
    packagingOptions {
        exclude 'META-INF/NOTICE'
        exclude 'META-INF/LICENSE'
    }
}

dependencies {
    compile fileTree(dir: 'src/main/third-party/java/infer-annotations/', include: ['*.jar'])
    compile 'com.android.support:appcompat-v7:23.0.1'
    compile 'com.android.support:recyclerview-v7:23.0.1'
    compile 'com.facebook.fresco:fresco:0.11.0'
    compile 'com.facebook.fresco:imagepipeline-okhttp3:0.11.0'
    compile 'com.facebook.soloader:soloader:0.1.0'
    compile 'com.fasterxml.jackson.core:jackson-core:2.2.3'
    compile 'com.google.code.findbugs:jsr305:3.0.0'
    compile 'com.squareup.okhttp3:okhttp:3.4.1'
    compile 'com.squareup.okhttp3:okhttp-urlconnection:3.4.1'
    compile 'com.squareup.okhttp3:okhttp-ws:3.4.1'
    compile 'com.squareup.okio:okio:1.9.0'
    compile 'org.webkit:android-jsc:r174650'

    testCompile "junit:junit:${JUNIT_VERSION}"
    testCompile "org.powermock:powermock-api-mockito:${POWERMOCK_VERSION}"
    testCompile 'com.fasterxml.jackson.core:jackson-databind:2.2.3'
    testCompile "org.powermock:powermock-module-junit4-rule:${POWERMOCK_VERSION}"
    testCompile "org.powermock:powermock-classloading-xstream:${POWERMOCK_VERSION}"
    testCompile "org.mockito:mockito-core:${MOCKITO_CORE_VERSION}"
    testCompile "org.easytesting:fest-assert-core:${FEST_ASSERT_CORE_VERSION}"
    testCompile "org.robolectric:robolectric:${ROBOLECTRIC_VERSION}"

    androidTestCompile 'com.android.support.test:runner:0.3'
    androidTestCompile "org.mockito:mockito-core:${MOCKITO_CORE_VERSION}"
}

apply from: 'release.gradle'

这样，编译好后，整个项目都在自己手上了，就可以很方法进行一些改动。


最近更新的内容
你可能感兴趣的文章

2024 - 快车库 - 我的知识库 重庆启连科技有限公司 渝ICP备16002641号-10
企客连连 表单助手 企服开发 榜单123

渝公网安备 50010702501581号