App automatisch bauen und releasen mit Github Actions

Dieses Tutorial konzentriert sich auf das GitHub Hosting, lässt sich aber mit wenigen Anpassungen auf jede andere CI/CD-Plattform übertragen.

Vorwort

Stelle sicher, dass du deine Capacitor App zuerst zu Capgo hinzugefügt hast; dieses Tutorial konzentriert sich nur auf die Upload-Phase. Falls du deine App zu Capgo hinzufügen möchtest, folge diesem Tutorial

Commit-Konvention

Zuerst musst du mit der Einhaltung der Commit-Konvention beginnen Conventional Commits` das hilft den Tools, die Versionsnummer korrekt zu aktualisieren; es ist in 5 Min. gelernt.`

GitHub Actions für Tags

Erstelle dann deine erste GitHub Action, um automatisch zu builden und Tags zu erstellen.

Erstelle eine Datei unter diesem Pfad: .github/workflows/bump_version.yml

mit diesem Inhalt:

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

Dadurch wird für jeden Commit im main-Branch ein Tag veröffentlicht und ein Changelog-Eintrag erstellt. CHANGELOG.md.

Keine Sorge, falls du diese Datei noch nicht hast – sie wird automatisch erstellt.

Um das einzurichten, erstelle eine PERSONAL ACCESS TOKEN und füge es zu deinen GitHub hinzu Secrets als PERSONAL_ACCESS_TOKEN.

Dies ist notwendig, damit die CI den Changelog committen kann.

Wähle beim Erstellen des Tokens als Ablaufdatum never und als Scope repo.

Setze zuletzt die Version in deiner package.json -Datei und synchronisiere sie mit deiner Native-Versionsnummer, um den nächsten Schritt zu erleichtern.

Dies ist nur beim ersten Mal nötig; danach halten die Tools alles aktuell.

Du kannst nun beide Dateien committen und siehst deinen ersten Tag in GitHub!

Sowohl die native als auch die Web-Plattform erhalten nach jedem Commit einen Versionssprung.

GitHub Actions für den Build

Erstelle eine Datei unter diesem Pfad: .github/workflows/build.yml

mit diesem Inhalt:

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

Dadurch wird deine Dependency installiert und gebaut, bevor sie an Capgo gesendet wird.

Falls dein Build-Befehl anders lautet, kannst du ihn hier ändern: build_code Schritt.

Damit das funktioniert, benötigst du deinen API Key für Capgo. Füge ihn in das Secret deines GitHub Repositories hinzu als CAPGO_TOKEN.

Du kannst nun beide Dateien committen und siehst deinen ersten Tag in GitHub!

Ein Commit löst einen neuen Build für den Production-Channel aus.

Du solltest Tests im Build-Schritt hinzufügen, um sicherzustellen, dass dein code korrekt funktioniert.

Gehe zu deinem Capgo Dashboard und überprüfe deinen soeben erstellten Build – dein CI/CD-System steht nun bereit.

Wenn alle deine Nutzer das Update erhalten sollen, sobald es verfügbar ist, geh zu deinem Channel und stelle ihn auf public.

Du kannst auch den Native Build deiner Ionic Capacitor JavaScript App hinzufügen, indem du diesem Tutorial folgst 👇

Weiterlesen: Automatischer Build und Release deiner App mit Github Actions

Wenn du es nutzt App automatisch bauen und releasen mit Github Actions um CI/CD-Automatisierung zu planen, verbinde es mit Capgo CI/CD für den Produkt-Workflow in Capgo CI/CD, Capgo Native Builds für den Produkt-Workflow in Capgo Native Builds, Capgo Integrationen für den Produkt-Workflow in Capgo Integrations, CI/CD-Integration für die Implementierungsdetails in der CI/CD-Integration und GitHub Actions-Integration für die Implementierungsdetails in der GitHub Actions-Integration.