React Native 打包生成apk文件

在上一篇文章中我记录了Android原生接入React Native的一些知识点,那么接入开发完毕之后就需要打包生成正式apk文件,本篇文章就开始介绍如何打包。

先说明一下,平时开发RN的时候,首先需要react-native start 开启服务,然后通过react-native run-android 就安装到手机或者模拟器了,然后也能运行。但是这里打的测试包其实不包含js代码,而是通过连接js Server来显示的。但是正式打包肯定不能这么干,所以相比较而言RN这种打包apk与我们平时Android打包,区别就在于RN要把js那部分打包进去。然后网上有很多关于RN打包生成apk的文章,说的也很好,比如【React Native开发】React Native进行签名打包成Apk(5)这篇文章。但是呢,其实这些文章记录的跟我的情况还不一样,我的是Android原生接入RN,而大部分文章写的是RN工程包含android,然后打包生成apk文件。

所以,整个工程的结构都不一样,因此我也是尝试很多次才打包成功。。

步骤如下:

  • 首先第一步需要一个签名文件,这个一般都有吧,没有的话可以通过android studio生成,比较简单。
  • 将签名文件复制到工程的app moudle目录下
  • 需要对Android工程进行配置

工程配置如下:

  • 修改项目中gradle.properties文件:
MYAPP_RELEASE_STORE_FILE=youdo.jks
MYAPP_RELEASE_KEY_ALIAS=qndroid
MYAPP_RELEASE_STORE_PASSWORD=rzq123456
MYAPP_RELEASE_KEY_PASSWORD=rzq123456

说明一下,填写的时候将签名文件的名称、密码、别名、别名密码都替换一下,应该没啥问题

  • 在moudle的gradle的文件下,进行如下配置:

    // 配置签名文件
    signingConfigs {
        release {
            storeFile file("youdo.jks")
            storePassword "rzq123456"
            keyAlias "qndroid"
            keyPassword "rzq123456"
        }
    }

    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'

            signingConfig signingConfigs.release

        }
    }
  • 生成签名包 由于是Android接入RN的,所以不存在react.gradle文件,接下来需要在main目录下生成assets文件,然后生成index.android.bundle文件放在这个文件夹下,在android studio的Terminal进行以下操作:

step 1: mkdir -p app/src/main/assets (在main目录下生成assets)

step 2: curl -k “http://localhost:8081/index.android.bundle” >app/src/main/assets/index.android.bundle (生成index.android.bundle)

step 3:./gradlew assembleRelease (打包生成apk文件,注意以上操作均在 Android工程的根目录 ,如果命令行打包卡住,用as的图形化界面打包试试)

到此为止,Android接入RN 项目的apk文件就生成了, 但是具体项目中其实还是需要多渠道打包的,可以统计各个渠道app的下载量,一般用友盟统计的比较多吧,下面介绍一些多渠道打包的配置:

  • 首先在AndroidManifest.xml的application下添加 :
 <meta-data android:name="UMENG_CHANNEL" android:value="${UMENG_CHANNEL_VALUE}" />
  • 接着在app的build.gradle文件下添加:
   // 多渠道设置
       productFlavors {
           kuan {}
           xiaomi {}
           qh360 {}
           baidu {}
           wandoujia {}
       }

       productFlavors.all {
           flavor -> flavor.manifestPlaceholders = [UMENG_CHANNEL_VALUE: name]
       }

       buildTypes {
           release {
               minifyEnabled false
               proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'

               signingConfig signingConfigs.release

           }
       }
  • 配置完成之后,就需要打包了,可以重复上面的那个打包步骤,命令行或者as的图形化界面打包都是可以的

总结说明

对比下来,Android接入RN之后,跟以前原生的Android工程打包唯一的不同点就是需要将js打包进来,也就是在打包之前需要额外的生成index.android.bundle文件。官网以及其他的文章介绍中生成这个文件的命令不同,比如其他地方生成这个文件的命令是curl -k "http://localhost:8081/index.android.bundle" >android/app/src/main/assets/index.android.bundle, 我们这个工程生成这个文件的命令是curl -k "http://localhost:8081/index.android.bundle" >android/app/src/main/assets/index.android.bundle,那是因为我们这个项目结构跟他们的不一样,这个是Android接入RN,其实本质都是一样的,只要找对文件的位置就ok了。

打包React Native应用成为Android APK文件,你需要按照以下步骤进行操作: 1. 在项目根目录下打开终端,并执行以下命令来生成一个签名密钥库(keystore)文件: ``` keytool -genkey -v -keystore your-key-name.keystore -alias your-alias-name -keyalg RSA -keysize 2048 -validity 10000 ``` 按照提示输入相关信息,如密钥库密码、别名、密码、姓名等,并记住这些信息。 2. 在项目的`android/app`目录下创建一个名为`release.keystore.properties`的文件,并将以下内容添加到文件中: ``` storeFile=your-key-name.keystore storePassword=密钥库密码 keyAlias=your-alias-name keyPassword=别名密码 ``` 确保替换上述属性的值为你在第一步中设置的实际值。 3. 打开项目的`android/app/build.gradle`文件,并将以下代码添加到文件的末尾: ```groovy def keystorePropertiesFile = 'release.keystore.properties' def keystoreProperties = new Properties() keystoreProperties.load(new FileInputStream(keystorePropertiesFile)) android { ... signingConfigs { release { storeFile file(keystoreProperties['storeFile']) storePassword keystoreProperties['storePassword'] keyAlias keystoreProperties['keyAlias'] keyPassword keystoreProperties['keyPassword'] } } buildTypes { release { ... signingConfig signingConfigs.release } } } ``` 确保将`release.keystore.properties`文件路径正确地与`load`方法中的参数匹配。 4. 在终端中切换到项目根目录,并执行以下命令来生成APK文件: ``` cd android ./gradlew assembleRelease ``` 这个过程可能需要一些时间,取决于你的项目大小和配置。 5. 在`android/app/build/outputs/apk/release/`目录下找到生成APK文件,它的名称类似于`app-release.apk`。 恭喜!你已经成功打包React Native应用成为Android APK文件。请记住,这个APK文件是发布版本,用于在设备上进行安装和分发。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值