Wie man eine Ionic Capacitor-App in Xcode Cloud erstellt

Voraussetzungen

Bevor Sie mit dem Tutorial fortfahren…

Stellen Sie sicher, dass Sie GitHub verwenden
Verwenden Sie Capacitor
Ihre App ist bereits auf dem Apple Store veröffentlicht
Wunsch, etwas zu lesen 😆…

Die Verwendung von Ionic ist optional, für Cordova könnte es funktionieren, aber ich habe es nicht ausprobiert.

Wichtig zu den Preisen

Preis Xcode Cloud

https://developer.apple.com/xcode-cloud/

Der Service ist ‘kostenlos’ bis zur Grenze.
Sie können im Screenshot den Preis und die Grenzen sehen (Preise zum Zeitpunkt der Erstellung des Tutorials, sie könnten sich in Zukunft ändern).

🔴 Nachdem wir auf die Anforderungen und Preise hingewiesen haben, wenn Sie möchten, können wir fortfahren…

📣 In dem Beitrag nehmen wir an, dass wir die App bereits im Apple Store erstellt haben

Einleitung

Um Xcode Ihr Capacitor-App zu bauen, müssen Sie einige Dinge einrichten.

Paketvorbereitung

Stellen Sie sicher, dass Ihr Build-Befehl in Ihrem package.json Skript enthalten ist. Dann fügen Sie das sync:ios Befehl wie unten hinzu.

{
  "scripts": {
    "build": "YOUR BUILD COMMAND",
    "sync:ios": "cap sync ios"
  }
}

Dieser Schritt macht den Post-Script-Step einfach

Post-Klon-Skript

Dieses Skript wird nach dem Klon-Schritt von Xcode Cloud ausgeführt

#!/usr/bin/env bash

set -x

export HOMEBREW_NO_INSTALL_CLEANUP=TRUE
# Install CocoaPods
echo "📦 Install CocoaPods"
brew install cocoapods
brew install node@18
brew link node@18

# Install dependencies
# XCode Cloud is literally broken for 2 months now - https://developer.apple.com/forums/thread/738136?answerId=774510022#774510022
npm config set maxsockets 3
npm ci
# or `pnpm install --frozen-lockfile` or `yarn add --frozen-lockfile` or bun install
npm run build 
# or npm run build
npm run sync:ios

Speichern Sie dieses File im Root Ihres Projekts und nennen Sie es ios/App/ci_scripts/ci_post_clone.sh

Dann machen Sie dieses File mit diesem Befehl ausführbar chmod +x ios/App/ci_scripts/ci_post_clone.sh

Erstellen Sie ein Xcode-Workflow

Öffnen Sie Xcode (ja, um Xcode zu entfernen, benötigen Sie Xcode)

Gehe zu dieser Registerkarte : Schritt 1 Xcode

Klicke auf Erstellen von Workflow, wähle deine App, klicke auf Weiter wie unten.

Schritt 2 Xcode

Klicke auf Workflow bearbeiten auf der linken Seite Schritt 2 Xcode

Gehe zur Registerkarte Umgebungen und wähle wie unten Mac 12.4 und überprüfe die richtige Option Schritt 3 Xcode

Wähle deine Startbedingung. Wenn du dieselbe Build wie wir verwendest, empfehle ich dir, Tag anstelle von Branch zu verwenden, um doppelte Builds zu vermeiden.

Setze deine Umgebungsvariable Schritt 4 Xcode

Verbinde dein GitHub Konto Xcode Schritt 5

Xcode Schritt 6

Dann aktivieren Sie das Workflow und committen Sie Ihre erste Änderung. Sie sollten sehen, dass Ihr Build in Xcode läuft.

Build Verarbeitung

In Xcode Cloud, Sie werden auf die Minuten abgerechnet, die Sie für die Ausführung Ihres CI/CD-Workflows verwendet haben. Aus Erfahrung dauert es etwa 10–15 Minuten, bevor ein Build im Apple Store verarbeitet werden kann.

Für private Projekte kann die geschätzte Kosten pro Build bis zu $0,008/min x 5 min = $0,4, oder mehr, je nach Konfiguration oder Abhängigkeiten Ihres Projekts.

Für Open-Source-Projekte sollte das kein Problem sein. Siehe Preise.