Vai alla sezione principale
Tutorial

Come costruire un'app Ionic Capacitor in Xcode Cloud

Usa Xcode Cloud per costruire la tua app Capacitor JS e evita di avere bisogno di MacOS.

Martin Donadieu

Martin Donadieu

Content Marketer

Come costruire un'app Ionic Capacitor in Xcode Cloud

Requisiti

Prima di continuare con il tutorial…

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

L'utilizzo di Ionic è facoltativo, per Cordova potrebbe funzionare, ma non l'ho provato.

Importante per il prezzo

Prezzo Xcode Cloud

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

Il servizio è 'gratuito' fino al limite.
Puoi vedere nello screenshot il prezzo e i limiti (prezzi alla data di creazione del tutorial, potrebbero subire cambiamenti in futuro)

🔴 Una volta avvertito dei requisiti e dei prezzi, se ti piace, continuiamo…

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

Intro

To fare in modo che Xcode costruca il tuo Capacitor app, hai bisogno di configurare alcune cose.

Preparazione del pacchetto

Assicurati di avere il tuo comando di build nel tuo package.json script. Poi aggiungi il sync:ios command come mostrato di seguito.

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

Questo passaggio farà funzionare lo script post semplicemente.

Script post clonazione

Questo script verrà eseguito da Xcode cloud dopo lo step di clonazione

#!/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 esegui questo file con il comando seguente. chmod +x ios/App/ci_scripts/ci_post_clone.sh

Creazione di un workflow di Xcode

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

E vai a questa scheda: Passo Xcode 1

Clicca su create workflow, seleziona il tuo app, clicca next come sotto.

Passo Xcode 2

Clicca su Edit workflow sulla sinistra Passo Xcode 2

Vai alla scheda ambienti e scegli come sotto Mac 12.4 e controlla l'opzione corretta Passo Xcode 3

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

Imposta la tua variabile di ambiente Passo Xcode 4

Connetti il tuo account GitHub Passo 5 di Xcode

Passo 6 di Xcode

Abilita quindi il flusso di lavoro e committa la tua prima modifica, dovresti vedere il tuo build in esecuzione in Xcode.

Elaborazione di costruzione

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

Per i progetti privati, il costo stimato per il build può arrivare fino a $0.008/min x 5 minuti = $0.4o 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.

Aggiornamenti in tempo reale per Capacitor app

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 nel normale percorso di revisione.

Inizia subito

Ultimi articoli dal nostro Blog

Capgo ti offre le migliori informazioni che ti servono per creare un'app mobile davvero professionale.