React Native で Android の Staging build を作成するのに必要な設定

(2024/07/21 編集) この記事の情報は古いです。React Native 0.71 から app/build.gradle の設定方法が変更されました。詳しくは https://reactnative.dev/docs/react-native-gradle-plugin

アプリを作成する時、ローカルで動作確認する Debug ビルドと本番環境である Release ビルドの他に、QAなど内部で使うための Staging ビルドが必要になることがある。

度々対応しているが、たまにやることを忘れて時間を食ってしまうので忘備録

app/build.gradle の修正

基本的にこのファイルだけを修正すれば良い。

android フォルダ直下にある build.gradle と android/app フォルダにある build.gradle の二種類があるが、後者の方。

staging build の追加

buildTypes に以下のように staging の項目を追加する

    buildTypes {
        debug {
          ...
        }

        release {
	  ....
        }

        staging {
            initWith release
            matchingFallbacks = ['release']
        }
    }

initWith release は release と同じ設定を使う為の設定。
matchingFallbacks = ['release'] は、特定の build での設定が外部で必要になった時に release の設定を使うための設定。

@react-native-async-storage/async-storage 等、react-native の外部パッケージはdebug と release で扱う設定がある為、matchingFallbacks でそこの release の設定を使うようにする。

これで、以下のコマンドで staging build が走るようになる

./gradlew assembleStaging

しかし、ビルドされたアプリを起動してもすぐにクラッシュしてしまう。

hermes のパスの設定

js engine に hermes を使用している場合、ビルド毎にどのhermesを使用するかを指定する必要がある

hermes のパスを指定している箇所にて、staging用の設定を以下のように追加する。

    if (enableHermes) {
        def hermesPath = "../../../../node_modules/hermes-engine/android/";
        debugImplementation files(hermesPath + "hermes-debug.aar")
        releaseImplementation files(hermesPath + "hermes-release.aar")
	 // staging build で hermes を使う為の設定
        stagingImplementation files(hermesPath + "hermes-release.aar")

    } else {
        implementation jscFlavor
    }

staging 以外の buildType を追加する場合は foobarImplementation のように、buildType 名の後に Implementation を追記する。

debug 用の hermes を使用したい場合は hermes-debug, release 用の hermes を使用したい場合は hermes-release を指定する

jsbundle の作成フラグを建てる

react-native は js のファイルを metro bundler を用いて bundle してアプリで起動する。

debug build はデフォルトでは bundle ファイルは保存せずに metro bundler を watch モードで起動してそのまま使う用になっている
release build はデフォルトでは index.android.bundle をビルド時に作成して使うようになっている。

他のbuildTypeの場合は index.android.bundle を作成する場合は個別で設定が必要になる
build.gradle の project.ext.react に以下の設定を追加する。

project.ext.react = [
    enableHermes: true,  // clean and rebuild if changing
    // staging build で index.android.bundle を作成する為の設定
    bundleInStaging: true,
]

staging 以外の buildType を追加する場合は bundleInFoobar のように、buildType 名の前に bundleIn を追記する。

まとめ

以上の設定を行えば、以下のコマンドで staging build が作成され、無事アプリも起動するようになる。

./gradlew assembleStaging

余談だけど、これらの情報は全部 react-native init した時の app/build.gradle 内のコメントに記載されてる。コメントはちゃんと読もう。