GitHubとExpoを連携させてCIを設定しました。
はじめに
GitHub ActionsでEASビルドができるかどうかのCIを入れたかったので、調べて入れました。
ExpoのCIを設定
ExpoのCIを設定するには2つ方法があります。
CIからビルドを開始する
Expo GitHubアプリからビルドを開始する
今回はExpo GitHubアプリからビルドを開始するやり方でCIを設定します。
公式の手順と同じことを行なっていますが、個人的に少しわかりにくかったところがあるので、追記しています。
前提
EASビルドができることを前提としています。
作成しているeas.jsonのimageを設定します。
eas.json
{
"build": {
"production": {
"android": {
"image": "latest"
},
"ios": {
"image": "latest"
}
}
}
}
androidとiosのサーバーimageはこちらに記載されています。
GitHubからビルドを走らせる
GitHubからビルドを走らせる方法は3つあります。
- Expoウェブサイトを使用して構築する
- GitHub PRラベルを使用してビルドする
- コードがリポジトリにプッシュされると自動的にビルドする
この方法全てやってみたので、その方法を記載します。
Expoウェブサイトを使用して構築する
対象のPJを開き、Project GitHub settingsの設定をしていきます。
Base directoryを設定します。ここには、Turborepoなどの中にExpoを使用している際に、Expoのルートディレクトリがどこにあるのかを指定します。
All buildsのBuild From GitHubボタンを押下して設定します。
ビルドするプラットフォームは、今回はiOSを設定しました。
Git Refは、ブランチ名とコミットハッシュ、タグでビルドできるように設定できます。今回はmainブランチでビルドします。
EAS Build profileには、eas.jsonで指定したprofile名を書き、その環境がどれなのか設定します。今回は、profileのdevelopをdevelopment環境として扱いたいので、下記の画像のように設定しました。
設定後に、Buildの欄に設定したブランチのbuildが出てきたら成功です🎉
(画像はmainのブランチじゃなくてごめんなさい🙇♀️)
eas.jsonのprofile
{
"build": {
"develop": { //ここの命名とEAS Build profileの命名を一致させる
"developmentClient": true,
"distribution": "internal",
"credentialsSource": "remote"
},
"staging": { //ここの命名とEAS Build profileの命名を一致させる
"distribution": "internal"
},
"production": { //ここの命名とEAS Build profileの命名を一致させる
"autoIncrement": true
}
},
}
GitHub PRラベルを使用してビルドする
GItHubのPRの右端にあるlabelの編集を押下します。
New labelを押下して、新しいlabelを作成します。
labelは、eas-build-[platform]:[profile]に当てはめて作成します。
今回私は、iOS,Androidどちらも通したいのでaii、eas.jsonのprofileはdevelopに設定したので、developと書きました。
labelを設定して、PRを作成すると、下記の画像のように表示されます！
PRにExpoのマークが出てきたら成功です🎉
コードがリポジトリにプッシュされると自動的にビルドするよう設定
ConfigrationのGitHubへ移動し、New Build Triggerを押下します。
Build Triggerでは、PRのビルドタイミングの設定ができます。
Build Triggerには三種類あります。
- Pull request
- Push to branch
- Git tag
この中で、1.2を今回は設定しました。
Pull request
Pull requestは、PR作成時と更新時どのブランチに走るようにするか設定します。
Source branch patternはどのブランチから、Target branch patternどのブランチへ(向き先)かを決めます。
今回は、ワイルドカード(すべて)のブランチからmainブランチに向けられたPRが作成された時に走るようにしました。
Push to branch
Push to branchは、指定されたブランチにpushされた直後とマージされた際に走るように設定します。
今回は、mainブランチにpushされた直後とマージされた際に走るように設定しました。
これでPRにExpoのマークが出てきたら成功です🎉
Discussion