開発ビルドを説明する前に、標準で使うExpo Goアプリを見ていきます。
npx create-expo-app で最初のReact Nativeプロジェクトを作成し、npx expo start で起動したときは、開発にExpo Goを使ったかもしれません。Expo Goは、すぐにコードを書き始められるようにExpoが開発し、Google PlayストアやApple App Storeに公開したネイティブアプリです。複数のネイティブライブラリを含む
サンドボックスアプリ
です。依存関係の一覧も参照してください。ローカルのコンピューターでアプリのJavaScriptコードを更新し、Expo Goで変更を確認できます。(出典
Expo公式ドキュメント↗)
簡単に言えば、ビルド済みのExpo Goアプリを器にして、JavaScriptを修正し、結果をすぐ確認できる開発環境です。便利ですが、ネイティブコードは変更できません。そのため、一部のライブラリやプッシュ通知などはExpo Goで動かないことがあります。Expoはこの問題に対応するため、ネイティブコードを変更できる手段を用意しています。それを扱いやすくしたものが開発ビルド(Development Build)です。
expo-dev-clientをインストールする 🔗
Expo Goには開発者向けメニューが組み込まれているので、別途追加する必要はありません。実行中のターミナルでキーボードのmを押すと表示されるメニューです。expo-dev-clientを使えば、このメニューを開発ビルドでも使えます。
npx expo install expo-dev-client
主な方法は、EASを使う方法と、ローカル環境でビルドする方法の2つです。
EASはExpo Application Servicesの略で、Expoが提供するクラウドサービスです。ビルド、アップデート、提出のワークフローに対応するツールで、AndroidとiOS向けのアプリを作れます。ストアに公開する場合や、複数人で開発する場合に適しています。ビルド結果はローカルに自動でインストールされず、利用量にも制限がある点に注意してください。
始める前に、次のコマンドでEAS CLIをインストールしてログインします。
npm install -g eas-cli
eas login
eas build --platform android --profile development
iOSシミュレーター向けにビルドする場合、ルートフォルダーに eas.json を追加し、次のように書きます。
{
"build": {
"development": {
"ios": {
"simulator": true
}
}
}
}
次のコマンドを実行します。
eas build --platform ios --profile development
実機向けにビルドする場合は、次のコマンドを使います。
npx expo run:ios --device
例えばiOSシミュレーター用のビルドが完了すると、自動的にダウンロードするか尋ねられます。
Expoダッシュボード↗でも、ビルドが作られたことを確認できます。
ビルドを選んでダウンロードすると、~.tar.gz ファイルを取得できます。展開して出てきたパッケージをシミュレーターにドラッグ&ドロップすると、アプリがインストールされます。
ビルドが終わると、シミュレーターにアプリがインストールされます。Expo Goを使わず、ネイティブコードを変更できる開発環境ができました。npm start で起動し、s を押して開発ビルドのアプリを開き、作業を進められます。
プロジェクトのルートには、対象OSのビルドに応じたフォルダー(ios、android)が作られます。その中にあるネイティブコードを編集し、Expo Goでは確認できなかった変更を試せるようになります。
- デプロイを自動化するには、どのような方法があるでしょうか。