ReactNative-Android笔记(持续更新...)

2019-05-09  本文已影响0人  Hozan

1、创建项目

react-native init AwesomeProject

提示:你可以使用--version参数(注意是两个杠)创建指定版本的项目。例如react-native init MyApp --version 0.44.3。注意版本号必须精确到两个小数点

2、编译相关问题

遇到gradle下载超时,可以先下载到本地,下载链接:http://services.gradle.org/distributions/
在C:\Users\Administrator.gradle\wrapper\dists找到那个版本的文件夹,将下载的.zip包放到文件夹下:

image.png
androidstudio修改,然后重新编译项目:
image.png

3、修改包名

(1)修改build.gradle(app)
(2)修改AndroidManifest.xml
(3)修改包名文件路径

4、打包

先配置好一个签名key文件,不懂的可以参考官网,直接在AS生成也很简单。然后在项目的android目录下,输入命令行gradlew assembleRelease即可打包apk。

注意:

加上以下代码能把apk从21M缩小到5.89M,因为过滤掉了不需要的so文件。minifyEnabled true启用混淆。
(注意debug版的不要启用混淆,可能导致报错)

Proguard 是一个 Java 字节码混淆压缩工具,它可以移除掉 React Native Java(和它的依赖库中)中没有被使用到的部分,最终有效的减少 APK 的大小。

ndk {
   abiFilters "armeabi-v7a", "x86"
 }
minifyEnabled true

build.gradle(app)文件具体配置如下:

apply plugin: "com.android.application"

import com.android.build.OutputFile

/*
 * The react.gradle file registers a task for each build variant (e.g. bundleDebugJsAndAssets
 * and bundleReleaseJsAndAssets).
 * These basically call `react-native bundle` with the correct arguments during the Android build
 * cycle. By default, bundleDebugJsAndAssets is skipped, as in debug/dev mode we prefer to load the
 * bundle directly from the development server. Below you can see all the possible configurations
 * and their defaults. If you decide to add a configuration block, make sure to add it before the
 * `apply from: "../../node_modules/react-native/react.gradle"` line.
 **/
project.ext.react = [
        // the name of the generated asset file containing your JS bundle
        bundleAssetName      : "index.android.bundle",

        // the entry file for bundle generation
        entryFile            : "index.js",

        // whether to bundle JS and assets in debug mode
        bundleInDebug        : true,
        bundleInStaging      : true,
        // whether to bundle JS and assets in release mode
        bundleInRelease      : true,

        // whether to bundle JS and assets in another build variant (if configured).
        // See http://tools.android.com/tech-docs/new-build-system/user-guide#TOC-Build-Variants
        // The configuration property can be in the following formats
        //         'bundleIn${productFlavor}${buildType}'
        //         'bundleIn${buildType}'
        // bundleInFreeDebug: true,
        // bundleInPaidRelease: true,
        // bundleInBeta: true,

        // whether to disable dev mode in custom build variants (by default only disabled in release)
        // for example: to disable dev mode in the staging build type (if configured)
        devDisabledInStaging : false,
        // The configuration property can be in the following formats
        //         'devDisabledIn${productFlavor}${buildType}'
        //         'devDisabledIn${buildType}'

        // the root of your project, i.e. where "package.json" lives
        root                 : "../../",

        // where to put the JS bundle asset in debug mode
        jsBundleDirDebug     : "$buildDir/intermediates/assets/debug",

        // where to put the JS bundle asset in release mode
        jsBundleDirRelease   : "$buildDir/intermediates/assets/release",

        // where to put drawable resources / React Native assets, e.g. the ones you use via
        // require('./image.png')), in debug mode
        resourcesDirDebug    : "$buildDir/intermediates/res/merged/debug",

        // where to put drawable resources / React Native assets, e.g. the ones you use via
        // require('./image.png')), in release mode
        resourcesDirRelease  : "$buildDir/intermediates/res/merged/release",

        // by default the gradle tasks are skipped if none of the JS files or assets change; this means
        // that we don't look at files in android/ or ios/ to determine whether the tasks are up to
        // date; if you have any other folders that you want to ignore for performance reasons (gradle
        // indexes the entire tree), add them here. Alternatively, if you have JS files in android/
        // for example, you might want to remove it from here.
        inputExcludes        : ["android/**", "ios/**"],

        // override which node gets called and with what additional arguments
        nodeExecutableAndArgs: ["node"],

        // supply additional arguments to the packager
        extraPackagerArgs    : []
]


project.ext.react = [
        entryFile: "index.js"
]

apply from: "../../node_modules/react-native/react.gradle"

/**
 * Set this to true to create two separate APKs instead of one:
 *   - An APK that only works on ARM devices
 *   - An APK that only works on x86 devices
 * The advantage is the size of the APK is reduced by about 4MB.
 * Upload all the APKs to the Play Store and people will download
 * the correct one based on the CPU architecture of their device.
 */
def enableSeparateBuildPerCPUArchitecture = false

/**
 * Run Proguard to shrink the Java bytecode in release builds.
 */
def enableProguardInReleaseBuilds = true

android {
    compileSdkVersion rootProject.ext.compileSdkVersion

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    defaultConfig {
        applicationId "com.hozan.hx"
        minSdkVersion rootProject.ext.minSdkVersion
        targetSdkVersion rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0"
        ndk {
            abiFilters "armeabi-v7a"
        }
    }
    splits {
        abi {
            reset()
            enable enableSeparateBuildPerCPUArchitecture
            universalApk false  // If true, also generate a universal APK
            include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
        }
    }
    signingConfigs {
        release {
            storeFile file('android.keystore')
            storePassword 'your storePassword '
            keyAlias 'mykey.keystore'
            keyPassword 'your keyPassword'
        }
    }
    buildTypes {
        release {
            signingConfig signingConfigs.release
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
        staging {
            applicationIdSuffix '.staging'
            signingConfig signingConfigs.release
            minifyEnabled enableProguardInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
        debug {
            applicationIdSuffix '.debug'
//            debuggable true
            signingConfig signingConfigs.release
            minifyEnabled false
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
        }
    }
    // 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, "arm64-v8a": 3, "x86_64": 4]
            def abi = output.getFilter(OutputFile.ABI)
            if (abi != null) {  // null for the universal-debug, universal-release variants
                output.versionCodeOverride =
                        versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
            }
        }
    }
}

dependencies {
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
    implementation "com.facebook.react:react-native:+"  // From node_modules
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
    from configurations.compile
    into 'libs'
}


打bundle包命令:

在src/main下新建assets文件夹,在项目的根目录下运行下面命令行:
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/

5、分包部署

为啥要分包部署呢?分包部署对于集成code-push等第三方库有很好的用处。比如说集成code-push热更新,你需要先在staging灰度环境下测试通过了再更新到正式环境,此时就需要两种部署。同样道理集成极光推送也需要两种部署环境,一个供测试,一个是正式上线。
按照上面的build.gradle的配置,在项目的android目录下运行,gradlew assemble即可打包出debug、staging、release三种部署的apk。


image.png

如果想让每个apk的包名不一样,可以通过applicationIdSuffix来改变包名,这样你就可以在手机安装三个apk了。

6、apk瘦身压缩

对于apk的优化瘦身有挺多方案,个人感觉移除不必要的so文件就可以减小很多M了,下面推荐一个链接参考:
【性能优化】也谈APK瘦身

后续在实践中,如果我有更好的apk优化方案,会在此做下总结。
目前我最新版的RN打包出的apk是5.89M,应该可以通过压缩等方案再缩小。

上一篇下一篇

猜你喜欢

热点阅读