[Flutter] GitHub ActionsとFastlaneを使ってFlutterアプリをデプロイする

2022-11-27 hit count image

Fastlaneが設定されたFlutterプロジェクトをGitHub Actionsを使ってデプロイする方法について説明します。

概要

以前のブログポストではGitHub Actionsを使ってFlutterプロジェクトのコードを静的分析して、テストコードを実行する方法について説明しました。

また、FlutterプロジェクトにFastlaneを設定してFlutterアプリをAndroidとiOSのアプリストアへ自動でデプロイする方法についても説明しました。

このブログポストではGitHub ActionsFastlaneを実行してFlutterで開発したアプリをデプロイする方法について説明します。

デプロイのためGitHub Actionsファイル

Flutterで開発したアプリをiOSとAndroidのアプリストアへデプロイするためGitHub Actionsファイルを生成してみましょう。GitHub Actionsファイルを作るためFlutterプロジェクトフォルダ中に./.github/workflows/main.ymlファイルを生成して次のように修正します。

name: Deploy iOS and Android App to App Store and Play Store
on:
  push:
    tags:
      - 'v*'

このGitHub ActionsはGitのタグにvで始まるタグ(v1.2.3)が追加された時、実行されるように設定しました。

これからiOSAndroidのためGitHub Actionsを追加してFlutterで開発したアプリをデプロイする方法についてみてみましょう。

iOSのためFastlaneを実行するGitHub Actions

FlutterアプリをiOSのアプリストアへデプロイするため設定したFastlaneGitHub Actionsを使ってデプロイするためGitHub Actionsを作ってみましょう。./.github/workflows/main.ymlファイルを開いて下記のように修正します。

name: Deploy iOS and Android App to App Store and Play Store
on:
  ...
jobs:
  release-ios:
    name: Build and release iOS app
    runs-on: macos-latest
    steps:
      - uses: maxim-lobanov/[email protected]
        with:
          xcode-version: latest-stable
      - uses: actions/[email protected]
      - uses: subosito/[email protected]
        with:
          flutter-version: '3.3.8'
      - uses: ruby/[email protected]
        with:
          ruby-version: '3.1.2'
      - name: Install Fastlane
        run: cd ios && bundle install && cd ..
      - name: Install packages
        run: flutter pub get
      - name: Install pods
        run: cd ios && pod install && cd ..
      - name: Prebuild
        run: flutter build ios --release --no-codesign
      - name: Execute Fastlane command
        run: cd ios && fastlane release type:github
        timeout-minutes: 40

このように生成したGitHub Actionsをもっと詳しく見てみます。

...
jobs:
  release-ios:
    name: Build and release iOS app
    runs-on: macos-latest
    ...

このGitHub Actionsは最新のmacOS(macos-lates)の上で実行されます。

...
jobs:
  release-ios:
    ...
    steps:
      - uses: maxim-lobanov/[email protected]
        with:
          xcode-version: latest-stable
    ...

その後、FlutterプロジェクトのiOSアプリをビルドしてデプロイするためXCodeをインストールします。

...
jobs:
  release-ios:
    ...
    steps:
      ...
      - uses: actions/[email protected]
      - uses: subosito/[email protected]
        with:
          flutter-version: '3.3.8'
      ...

その後、コードを取ってくるため、checkoutとFlutterプロジェクトをビルドするためFlutterをインストールします。

...
jobs:
  release-ios:
    ...
    steps:
      ...
      - uses: ruby/[email protected]
        with:
          ruby-version: '3.1.2'
      - name: Install Fastlane
        run: cd ios && bundle install && cd ..
      ...

FastlaneはRubyで開発されていますので、Fastlaneをインストールして実行するためにはRubyをインストールする必要があります。このようにインストールしたRubyを使ってFastlaneと必要なライブラリをインストールします。

...
jobs:
  release-ios:
    ...
    steps:
      ...
      - name: Install packages
        run: flutter pub get
      - name: Install pods
        run: cd ios && pod install && cd ..
      ...

次はFlutterプロジェクトをビルドするため必要なライブラリをインストールして、iOS用のライブラリも一緒にインストールします。

...
jobs:
  release-ios:
    ...
    steps:
      ...
      - name: Prebuild
        run: flutter build ios --release --no-codesign
      - name: Execute Fastlane command
        run: cd ios && fastlane release type:github
        timeout-minutes: 40

最後に、Flutterコマンドを使ってFlutterプロジェクトのiOSアプリをデプロイ用でビルドします。そして、Fastlaneを使ってアプリをデププロいします。

Fastlaneを使ってアプリをデプロイする時、結構時間が掛かります。私は無料で使えるGitHub Actionsの時間を最大5回使えるようにするためタイムアウト40分で設定しました。

AndroidのためFastlaneを実行するGitHub Actions

FlutterアプリをAndroidのグーグルプレイへデプロイするため設定されたFastlaneGitHub Actionsを使ってデプロイするためGitHub Actionsを作ってみましょう。./.github/workflows/main.ymlファイルを開いて下記のように修正します。

name: Publish iOS and Android App to App Store and Play Store
...
jobs:
  release-ios:
    ...
  release-android:
    name: Build and release Android app
    runs-on: ubuntu-latest
    steps:
      - uses: actions/[email protected]
      - uses: actions/[email protected]
        with:
          distribution: 'zulu'
          java-version: '12.x'
      - uses: subosito/[email protected]
        with:
          flutter-version: '3.3.8'
      - uses: ruby/[email protected]
        with:
          ruby-version: '3.1.2'
      - name: Install Fastlane
        run: cd android && bundle install && cd ..
      - name: Install packages
        run: flutter pub get
      - name: Prebuild
        run: flutter build appbundle
      - name: Execute Fastlane command
        run: cd android && fastlane release

このように生成したGitHub Actionsをもっと詳しく見てみましょう。

...
jobs:
  release-ios:
    ...
  release-android:
    name: Build and release Android app
    runs-on: ubuntu-latest
    ...

このGitHub Actionsは最新のubuntu(ubuntu-lates)の上で実行されます。

...
jobs:
  release-ios:
    ...
  release-android:
    ...
    steps:
      - uses: actions/[email protected]
      - uses: actions/[email protected]
        with:
          distribution: 'zulu'
          java-version: '12.x'
      ...

そして、コードを取ってくるためcheckoutとFlutterプロジェクトのAndroidアプリをビルドするためJavaをインストールします。

...
jobs:
  release-ios:
    ...
  release-android:
    ...
    steps:
      ...
      - uses: subosito/[email protected]
        with:
          flutter-version: '3.3.8'
      ...

その後、FlutterプロジェクトをビルドするためFlutterをインストールします。

...
jobs:
  release-ios:
    ...
  release-android:
    ...
    steps:
      ...
      - uses: ruby/[email protected]
        with:
          ruby-version: '3.1.2'
      - name: Install Fastlane
        run: cd android && bundle install && cd ..
      ...

FastlaneはRubyで開発されてますので、Fastlaneをインストールして実行するためRubyをインストールする必要があります。このようにインストールしたRubyを使ってFastlaneと必要なライブラリをインストールします。

...
jobs:
  release-ios:
    ...
  release-android:
    ...
    steps:
      ...
      - name: Install packages
        run: flutter pub get
      ...

次はFlutterプロジェクトをビルドするため必要なライブラリをインストールします。

...
jobs:
  release-ios:
    ...
  release-android:
    ...
    steps:
      ...
      - name: Prebuild
        run: flutter build appbundle
      - name: Execute Fastlane command
        run: cd android && fastlane release

最後に、Flutterコマンドを使ってFlutterプロジェクトのAndroidアプリをビルドします。そして、Fastlaneを使ってアプリをデプロイします。

全てのGitHub Actionsコード

今まで紹介したGitHub Actionsコードをまとめると次のようです。このGitHub Actionsコードを使ってFlutterアプリのデプロイに活用してみてください。

name: Deploy iOS and Android App to App Store and Play Store
on:
  push:
    tags:
      - 'v*'
jobs:
  release-ios:
    name: Build and release iOS app
    runs-on: macos-latest
    steps:
      - uses: maxim-lobanov/[email protected]
        with:
          xcode-version: latest-stable
      - uses: actions/[email protected]
      - uses: subosito/[email protected]
        with:
          flutter-version: '3.3.8'
      - uses: ruby/[email protected]
        with:
          ruby-version: '3.1.2'
      - name: Install Fastlane
        run: cd ios && bundle install && cd ..
      - name: Install packages
        run: flutter pub get
      - name: Install pods
        run: cd ios && pod install && cd ..
      - name: Prebuild
        run: flutter build ios --release --no-codesign
      - name: Execute Fastlane command
        run: cd ios && fastlane release type:github
        timeout-minutes: 40
  release-android:
    name: Build and release Android app
    runs-on: ubuntu-latest
    steps:
      - uses: actions/[email protected]
      - uses: actions/[email protected]
        with:
          distribution: 'zulu'
          java-version: '12.x'
      - uses: subosito/[email protected]
        with:
          flutter-version: '3.3.8'
      - uses: ruby/[email protected]
        with:
          ruby-version: '3.1.2'
      - name: Install Fastlane
        run: cd android && bundle install && cd ..
      - name: Install packages
        run: flutter pub get
      - name: Prebuild
        run: flutter build appbundle
      - name: Execute Fastlane command
        run: cd android && fastlane release

実行

このように生成したGitHub Actionsを実行するためにはGitのタグを生成する必要があります。次のコマンドを使ってGitのタグを生成します。

git tag -a v1.2.3 -m "release v1.2.3"

そして次のコマンドを使って生成したタグをGitHubへプッシュ(Push)します。 그리고 다음 명령어를 사용하여 생성한 태그를 GitHub에 푸시(Push)합니다.

git push origin v1.2.3

そしたらGitHubActionsタブで私たちが作ったGitHub Actionsが実行されることが確認できます。

完了

これでFastlaneでデプロイ自動化が設定されたFlutterプロジェクトをGitHub Actionsを使ってデプロイする方法について見てみました。皆さんもFastlaneGitHub Actionsを使ってアプリのデプロイ自動化を実装してみてください。

私のブログが役に立ちましたか?下にコメントを残してください。それは私にとって大きな大きな力になります!

アプリ広報

今見てるブログを作成たDekuが開発したアプリを使ってみてください。
Dekuが開発したアプリはFlutterで開発されています。

興味がある方はアプリをダウンロードしてアプリを使ってくれると本当に助かります。

Posts