Saltare 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

Editoria

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 ho provato.

Importante per il prezzo

Prezzo Xcode Cloud

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

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

🔴 Una volta avvertiti dei requisiti e dei prezzi, se lo desiderate, continuiamo…

📣 Nel post, supponiamo di avere l'app creata nell'Apple Store

Intro

Per far costruire Xcode la tua app Capacitor, devi impostare alcune cose.

Preparazione del pacchetto

Assicurati di avere la tua istruzione di costruzione nel tuo package.json script. Aggiungi poi il sync:ios comando come sotto.

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

Questo passaggio farà funzionare semplicemente lo script post clone.

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

Poi rendi questo file eseguibile con questo comando 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 successivo come sotto.

Passo Xcode 2

Clicca su Modifica flusso di lavoro sulla sinistra Passo Xcode 2

Vai alla scheda ambienti e scegli come sotto 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 committa 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 workflow 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 prezzi.

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 Builds nativi per il workflow del prodotto in Capgo Costruzioni native Capgo Integrazioni per il workflow del prodotto in Capgo Integrazioni Integrazione CI/CD per il dettaglio di implementazione in Integrazione CI/CD, e Integrazione GitHub Azioni per il dettaglio di implementazione in Integrazione GitHub Azioni

Aggiornamenti in tempo reale per le app Capacitor

Quando un bug del 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 sulla normale via di revisione.

supporto umano da parte di Martin

Inizia subito

Ultimi articoli dal nostro Blog

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