メインコンテンツにジャンプ
CI/CD

Githubアクションを使用した自動ビルドとリリースアプリ

Ionic Capacitor JSアプリの作成と、mainブランチにプッシュした度に自動的にGithubアクションを使用してデプロイ

マーティン・ドナディュー

マーティン・ドナディュー

コンテンツマーケター

Githubアクションを使用した自動ビルドとリリースアプリ

このチュートリアルはGitHubホスティングに焦点を当てていますが、他のCI/CDプラットフォームに適応するにはわずかな調整で使用できます。

序文

まず、CapacitorアプリをCapgoに追加してください。このチュートリアルはアップロードフェーズに焦点を当てています。 Capgoにアプリを追加する必要がある場合は、この チュートリアル

コミット規約

まずコミット規約を遵守する必要があります conventional commits` これは、バージョン番号をアップグレードするためのツールの理解を助けるため、この 5 分間で学べます。

Conventional Commits

GitHub タグのアクション

次に、自動ビルドとタグの作成を行うための最初の GitHub アクションを作成する必要があります。

ファイルを作成するパス: .github/workflows/bump_version.yml

この内容で:

name: Bump version

on:
  push:
    branches:
      - main

jobs:
  bump-version:
    if: "!startsWith(github.event.head_commit.message, 'chore(release):')"
    runs-on: ubuntu-latest
    name: "Bump version and create changelog with standard version"
    steps:
      - name: Check out
        uses: actions/checkout@v6
        with:
          fetch-depth: 0
          filter: blob:none
          token: '${{ secrets.PERSONAL_ACCESS_TOKEN }}'
      - name: Git config
        run: |
          git config --local user.name "github-actions[bot]"
          git config --local user.email "github-actions[bot]@users.noreply.github.com"
      - name: Create bump and changelog
        run: npx capacitor-standard-version
      - name: Push to origin
        run: |
          CURRENT_BRANCH=$(git rev-parse --abbrev-ref HEAD)
          remote_repo="https://${GITHUB_ACTOR}:${{ secrets.PERSONAL_ACCESS_TOKEN }}@github.com/${GITHUB_REPOSITORY}.git"
          git pull $remote_repo $CURRENT_BRANCH
          git push $remote_repo HEAD:$CURRENT_BRANCH --follow-tags --tags

これにより、主ブランチのすべてのコミットごとにタグがリリースされ、主ブランチのすべてのコミットごとに変更履歴エントリが追加されます。 CHANGELOG.md.

このファイルが必要ない場合は心配しないでください。自動的に作成されます。

この機能を実現するには、 パーソナル アクセス トークン GitHub に追加してください シークレット そして PERSONAL_ACCESS_TOKEN.

CI がチェンジログをコミットできるようにするために必要です。

トークンを作成するときは、有効期限を never スコープを repo.

最後に、__CAPGO_KEEP_0__ のファイルのバージョンを設定し、Native バージョン番号と同期してください。これにより、次のステップが簡単になります。 package.json 最初の時のみ必要です。ツールはその後自動的に更新します。

__CAPGO_KEEP_0__ でタグが表示されます!

You can now commit this both files and see your first tag appear in GitHub!

両方のネイティブプラットフォームとWebプラットフォームは、各コミット後にバージョン番号を上げます。

GitHubのアクションをビルドに使用します。

このパスにファイルを作成します: .github/workflows/build.yml

この内容で:

name: Build source code and send to Capgo

on:
  push:
    tags:
      - '*'
      
jobs:
  deploy:
    runs-on: ubuntu-latest
    name: "Build code and release"
    steps:
      - name: Check out
        uses: actions/checkout@v6
      - name: Install dependencies
        id: install_code
        run: npm i
      - name: Build
        id: build_code
        run: npm run build
        env: # Remove both lines  if you don't need it
          FIREBASE_CONFIG: ${{ secrets.FIREBASE_CONFIG }} # Example of env var coming from a secret
      - name: Create Release
        id: create_release
        run: npx @capgo/cli@latest bundle upload -a ${{ secrets.CAPGO_TOKEN }} -c production

Capgoに依存関係をインストールしてビルドし、Capgoに送信します。

ビルド用のコマンドが異なります場合は、ステップで変更できます。 build_code この機能を実現するには、__CAPGO_KEEP_1__の__CAPGO_KEEP_0__キーを取得し、__CAPGO_KEEP_0__リポジトリのシークレットに追加する必要があります。

To make this work, you need to get your API key for Capgo, add it in the secret of your GitHub repository __CAPGO_KEEP_0__ CAPGO_TOKEN.

You can now commit this both files and see your first tag appear in GitHub!

__CAPGO_KEEP_0__

あなたのテストをビルドステップに追加してください。code が正常に動作していることを確認してください。

Capgo ダッシュボードに移動し、ご自身のビルドを確認してください。CI/CD システムがご自身にできました。

すべてのユーザーが利用できる更新を提供したい場合は、ご自身のチャンネルに移動し、更新を有効に設定してください。 public.

Ionic Capacitor JavaScript アプリのネイティブビルドを追加するには、このチュートリアルをご自身で実行してください 👇

Github アクションを使用して、自動ビルドとリリースアプリを継続してください。

CI/CD アウトメーションを計画するために「__CAPGO_KEEP_0__ CI/CD」を使用している場合、__CAPGO_KEEP_0__ CI/CD に接続してください。 Github CI/CD の製品ワークフローで「Github CI/CD」を使用している場合、 __CAPGO_KEEP_0__ Native Builds の製品ワークフローで「__CAPGO_KEEP_0__ Native Builds」を使用している場合、 CI/CDの自動化を計画するために「Automatic build and release app with Capgo actions」を使用している場合、 Capgo CI/CDに接続してください。 Capgo CI/CDの製品ワークフローで「Capgo CI/CD」を使用している場合、 Capgo Native Buildsの製品ワークフローで「Capgo Native Builds」を使用している場合、 Capgo 連携 Capgo 連携の製品ワークフローについて CI/CD 連携 CI/CD 連携の実装詳細について GitHub アクション連携 GitHub アクション連携の実装詳細について

Capacitor アプリ用リアルタイム更新

ウェブ層のバグが生じた場合、Capgo を使用して修正を配信し、アプリストアの承認待ちの日数を省きます。ユーザーはバックグラウンドで更新を受け取り、ネイティブの変更は通常のレビュー経路を通じます。

スタートする

ブログの最新記事

Capgo を使用すると、プロフェッショナルなモバイルアプリを開発するために必要な最良の洞察を得ることができます。