Vai al contenuto principale
Guida

How to build Ionic Capacitor app in Xcode Cloud

Use Xcode cloud to build your Capacitor JS app and bypass the need of MacOS.

Crediti dell'articolo

Martin Donadieu

Autore

Valeria

Revisione

Jordan

Redattore

How to build Ionic Capacitor app in Xcode Cloud

Requisiti

Prima di continuare con il tutorial…

  • Assicurati di utilizzare GitHub
  • Utilizza Capacitor
  • La tua app è già distribuita su Apple Store
  • Desiderio di leggere 😆…

Utilizzare Ionic è facoltativo, per Cordova potrebbe funzionare, ma non l'ho provato.

Importante per il prezzo

Prezzo Xcode Cloud

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

La servizio è ‘gratuito fino al limite.
Potete vedere nello screenshot il prezzo e i limiti (i prezzi al momento della creazione del tutorial, potrebbero subire cambiamenti in futuro)

🔴 Dopo aver ricevuto le avvertenze sui requisiti e sui prezzi, se lo desiderate, continuiamo…

📣 In questo post, supponiamo di avere già creato l'applicazione nel negozio Apple

Introduzione

Per far sì che Xcode costruiscano la vostra applicazione Capacitor, è necessario configurare alcune cose.

Preparazione del pacchetto

Sicurezza di avere la vostra istruzione di costruzione nel vostro package.json script. Aggiungere poi il sync:ios command come sotto.

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

Questa operazione renderà semplice il post script

Clonazione post script

Questo script verrà eseguito da Xcode Cloud dopo lo step di clone

#!/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

Salva questo file nella radice del tuo progetto e denominalo ios/App/ci_scripts/ci_post_clone.sh

Esegui poi questo file con il comando seguente chmod +x ios/App/ci_scripts/ci_post_clone.sh

Crea un flusso di lavoro di Xcode

Apri Xcode (sì, per rimuovere Xcode hai bisogno di Xcode)

E vai a questa scheda : Passo Xcode 1

Clicca su crea flusso di lavoro, seleziona la tua app, clicca su next come di seguito

Passo Xcode 2

Clicca su Modifica flusso di lavoro sulla sinistra Passo Xcode 2

Vai alla scheda ambienti e scegli come di seguito Mac 12.4 e verifica l'opzione corretta Passo Xcode 3

Scegli la tua condizione di partenza. Se utilizzi la stessa build di noi, ti consiglio di utilizzare la tag invece della branch, per evitare la doppia build.

Imposta la tua variabile di ambiente Passo Xcode 4

Collega il tuo account GitHub Passo Xcode 5

Passo Xcode 6

Poi abilita e il flusso di lavoro e commetti la tua prima modifica, dovresti vedere la tua build in esecuzione in Xcode.

Elaborazione della costruzione

In Xcode Cloud, sei fatturato in base ai minuti che hai utilizzato per eseguire il tuo flusso di lavoro CI/CD. Dall'esperienza, ci vuole circa 10-15 minuti prima che una build possa essere elaborata nella Apple Store.

For progetti privati, il costo stimato per la costruzione può arrivare fino a $0.008/min x 5 min = $0.4, o più, a seconda della configurazione o delle dipendenze del tuo progetto.

Per i progetti Open-source, questo non dovrebbe essere un problema per niente. Vedi tariffe.

Continua da Come costruire l'app Ionic Capacitor in Xcode Cloud

Se stai utilizzando Come costruire l'app Ionic Capacitor in Xcode Cloud per pianificare l'automazione CI/CD, connettilo con Capgo CI/CD per il flusso di lavoro del prodotto in Capgo CI/CD, Capgo Build Native per il workflow del prodotto in Capgo Build nativi Capgo Integrazioni per il workflow del prodotto in Capgo Integrazioni Integrazione CI/CD per i dettagli di implementazione in Integrazione CI/CD, e Integrazione GitHub Azioni per i dettagli di implementazione in Integrazione GitHub Azioni

Aggiornamenti in tempo reale per le app Capacitor

Quando un bug di layer web è attivo, invia la correzione attraverso Capgo invece di attendere giorni per l'approvazione della store. Gli utenti ricevono l'aggiornamento in background mentre le modifiche native rimangono nel normale percorso di revisione.

supporto umano da Martin

Inizia subito

Ultimi articoli dal nostro Blog

Capgo vi dà le migliori informazioni che avete bisogno per creare un'app mobile veramente professionale.