# ExpoとReact Nativeで作成したアプリのAPKを作成する

6 min read
react react-native アプリ
Table of Contents

作成中のマストドンクライアントアプリの1つの機能が完成したので実機で活用したいという思いが生まれ、apkを作成することにした。

最初のビルドを作成するを参考にして進めていき、無事にapkを作成することに成功した。

EAS CLIをインストール

ドキュメントが充実しているので、問題なくできるだろうと踏んでいたのだが、最初で壁にぶつかった。

npm install -g eas-cli

というコマンドでEAS CLIをインストールするのだが、なぜうまくインストールされない。

なんかVoltaの権限でうまく入らなかったので、

"C:\\Program Files\\Volta\\npm.exe" install -g eas-cli

を管理者権限で実行したら成功した。

C:\Windows\System32>eas --version
eas-cli/14.2.0 win32-x64 node-v20.15.0
npm install -g eas-cli

npm install -g eas-cliではシステムのPATHにあるデフォルトのnpmを使うけど、"C:\\Program Files\\Volta\\npm.exe" install -g eas-cliはVoltaで管理しているnpmを使用するという違いがあるらしい。

ログインする

PS C:\dev\appname> eas login
Log in to EAS with email or username (exit and run eas login --help to see other login options)
√ Email or username ... email
√ Password ... ********
Logged in

プロジェクトを構成する

AS Build 用に Android または iOS プロジェクトを構成するためにコマンドを実行する。

PS C:\dev\appname> eas build:configure
EAS project not configured.
√ Would you like to automatically create an EAS project for @username/appname? ... yes
✔ Created @username/appname: https://expo.dev/accounts/username/projects/appname on Expo
✔ Linked local project to EAS project xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
💡 The following process will configure your iOS and/or Android project to be compatible with EAS Build. These changes only apply to your local project files and you can safely revert them at any time.


√ Which platforms would you like to configure for EAS Build? » All


√ Generated eas.json. Learn more: https://docs.expo.dev/build-reference/eas-json/


🎉 Your project is ready to build.


- Run eas build when you are ready to create your first build.
- Once the build is completed, run eas submit to upload the app to app stores.
- Learn more about other capabilities of EAS Build: https://docs.expo.dev/build/introduction

Android エミュレーターとデバイス用の APK をビルドする

APK を作成するためのプロファイルの設定

eas.jsonを下記のように変更する。

{
  "build": {
    "preview": {
      "android": {
        "buildType": "apk"
      }
    },
    "preview2": {
      "android": {
        "gradleCommand": ":app:assembleRelease"
      }
    },
    "preview3": {
      "developmentClient": true
    },
    "preview4": {
      "distribution": "internal"
    },
    "production": {}
  }
}

そのうえで下記コマンドを実行する。

PS C:\dev\appname> eas build -p android --profile preview
We detected that you are building for the "internal" distribution. Resolving the environment for environment variables used during the build to "preview". Set the "environment" field in the build profile if you want to specify the environment manually.
No environment variables with visibility "Plain text" and "Sensitive" found for the "preview" environment on EAS servers.


📝  Android application id Learn more: https://expo.fyi/android-package
√ What would you like your Android application id to be? ... com.username.appname
No remote versions are configured for this project, versionCode will be initialized based on the value from the local project.
✔ Initialized versionCode with 1.
✔ Using remote Android credentials (Expo server)
√ Generate a new Android Keystore? ... yes
Detected that you do not have keytool installed locally.
✔ Generating keystore in the cloud...
✔ Created keystore


Compressing project files and uploading to EAS Build. Learn more: https://expo.fyi/eas-build-archive
✔ Compressed project files 1s (7.7 MB)
✔ Uploaded to EAS 1s
⌛️ Computing the project fingerprint is taking longer than expected...
⏩ To skip this step, set the environment variable: EAS_SKIP_AUTO_FINGERPRINT=1
✔ Computed project fingerprint


Build details: https://expo.dev/accounts/username/projects/appname/builds/xxxxxxxxxxxxxxxxxxxxx


Waiting for build to complete. You can press Ctrl+C to exit.
✔ Build finished


QRコードが表示される




🤖 Open this link on your Android devices (or scan the QR code) to install the app:
https://expo.dev/accounts/username/projects/appname/builds/xxxxxxxxxxxxxxxxxxxxx

iOSシミュレーター用のビルド

APK を作成するためのプロファイルの設定

eas.jsonを下記のように変更する。

{
  "build": {
    "preview": {
      "ios": {
        "simulator": true
      }
    },
    "production": {}
  }
}

そのうえで下記コマンドを実行する。

 eas build -p ios --profile preview
We detected that you are building for the "internal" distribution. Resolving the environment for environment variables used during the build to "preview". Set the "environment" field in the build profile if you want to specify the environment manually.
No environment variables with visibility "Plain text" and "Sensitive" found for the "preview" environment on EAS servers.


📝  iOS Bundle Identifier Learn more: https://expo.fyi/bundle-identifier
√ What would you like your iOS bundle identifier to be? ... com.username.appname
No remote versions are configured for this project, buildNumber will be initialized based on the value from the local project.
✔ Initialized buildNumber with 1.


Compressing project files and uploading to EAS Build. Learn more: https://expo.fyi/eas-build-archive
✔ Compressed project files 1s (7.7 MB)
✔ Uploaded to EAS 1s
✔ Computed project fingerprint


Build details: https://expo.dev/accounts/username/projects/appname/builds/xxxxxxxxxxxxxxx


Waiting for build to complete. You can press Ctrl+C to exit.
✔ Build finished


QRコードが表示される


🍏 Open this link on your iOS devices (or scan the QR code) to install the app:
https://expo.dev/accounts/username/projects/appname/builds/xxxxxxxxxxxxxxx

iOSはシミュレーターようなので実機での確認はできなかった。

My avatar

Thanks for reading my blog post! Feel free to check out my other posts or contact me via the social links in the footer.

More Posts
Comments