🦔

react-nativeでapkファイルを作成する

2023/12/19に公開

こんにちは投資ロウトです。

背景

react-nativeでアプリをテスト環境でテストするため、android用のapkファイルを作成する必要が出てきた

前提

react-nativeのプロジェクトなどは作成していること

作業

keystore作成

// androidフォルダに移動(プロジェクトのディレクトリにいる想定)
cd android

// apkに署名するためのキーストアを作成する
keytool -genkeypair -v -keystore キーストア名.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

keytool・・・キーと証明書を管理するためのユーティリティ

-genkeypair・・・キー・ペアを生成します

-v・・・詳細出力

-keystore・・・キーストア名

-alias・・・処理するエントリの別名

-keyalg・・・キー・アルゴリズム名

-keysize・・・キー・ビット・サイズ

-validity・・・有効日数

【聞かれる質問に関して】
・キーストアのパスワードを入力してください:6文字以上の文字列

・新規パスワードを再入力してください:上記のパスワード

・姓名は何ですか。:担当者などを入れる

・組織単位名は何ですか。:自分は株式会社を入れました

・組織名は何ですか。:会社名などを入れる

・都市名または地域名は何ですか。:

・都道府県名または州名は何ですか。:

・この単位に該当する2文字の国コードは何ですか。:jp

・CN=姓名, OU=組織単位名, O=組織名, L=都市名または地域名, ST=都道府県名または州名, C=2文字の国コードでよろしいですか。:よければy、ダメならenterで修正する

バージョン情報の設定

バージョン管理に関しては、下記リンクで記載しました。
主にversionCodeやversionNameを修正すればいい認識です。

https://zenn.dev/doshirote/articles/c5ad09dc25e49c

local.propertiesの作成

・react-nativeのandroidのフォルダに、local.propertiesというファイルを作成します。

ファイルの中身は以下を記述します。

# 以下はandroidのsdkのファイルの位置を設定します。(Macユーザーです)
sdk.dir=sdk.dir=/Users/ユーザー名/Library/Android/sdk

apkをビルドする

以下を実施してビルドします。

cd android
./gradlew assembleRelease

※buildをやり直すときは下記コマンドを先に実行して、上記のbulidを行なってください。

./gradlew clean 

バグ_1

File google-services.json is missing. 
  The Google Services Plugin cannot function without it. 
  Searched locations: /Users/xxx/app/yyy/android/app/src/release/google-services.json, /Users/xxx/app/yyy/android/app/src/release/google-services.json, /Users/xxx/app/yyy/android/app/src/google-services.json, /Users/xxx/app/yyy/android/app/src/release/google-services.json, /Users/xxx/app/yyy/android/app/src/Release/google-services.json, /Users/xxx/app/yyy/android/app/google-services.json

firebaseでandroidアプリを作成して、google-services.jsonを取得します。
プロジェクト概要のプロジェクトの設定から

アプリを追加を押下します。

androidを選択

上記の項目を入力してアプリを登録します。

google-services.jsonをダウンロードします。

react-nativeのアプリケーションのandroid/appの配下に配置します。

バグ2

再度ビルドしたところ下記のエラーが出ました。

* What went wrong:
Execution failed for task ':app:processReleaseGoogleServices'.
> No matching client found for package name 'com.xxx' in /Users/xxx/app/yyy/android/app/google-services.json

パッケージ名の項目が、android/app/src/main/AndroidManifest.xmlに記載されていないのが要因のようです。manifestの項目にpackage名を追加します。

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example">

またandroid/app/build.gradleのnamespaceとapplicationIdも同じパッケージ名に修正します。

※ただこちらの対応を実施しましたが、最終的には警告が出て、packageはここに書くべきではないという警告が出たので、削除を実施することになります。また「android/app/build.gradle」の「namespace」や「applicationId」に書くだけで良くなりました。

バグ3

上記を修正後さらに下記のバグが出ました。

/Users/xxx/app/yyy/android/app/src/main/java/com/xxx/MainApplication.java:59: エラー: シンボルを見つけられません
    ReactNativeFlipper.initializeFlipper(this, getReactNativeHost().getReactInstanceManager());

What went wrong:
Execution failed for task ':app:compileReleaseJavaWithJavac'.
> Compilation failed; see the compiler error output for details.

・下記ファイルのパッケージ名も変更しなければなりませんでした。

android/app/src/debug/java/com/xxx/ReactNativeFlipper.java
packageの名前を変更する必要がある。

android/app/src/release/java/com/xxx/ReactNativeFlipper.java
packageの名前を変更する必要がある。
※下記サイトのように「com.rndiffapp」のフォルダ名は変更する必要があります。

https://github.com/facebook/react-native/issues/36091

上記の様々な事象を解決して、無事buildできました。

buildが完成すると

以下の場所にapkファイルができるので、それをfirebaseにアップロードします。

android/app/build/outputs/apk/release/app-release.apk

※firebase distributionの場所にアップロードするのは、以下のリンクのようにしていただくとできると思います。

https://zenn.dev/doshirote/articles/2caf67f9649d67

Discussion