Langsung ke konten utama
Tutorial

Cara build aplikasi Ionic Capacitor di Xcode Cloud

Gunakan Xcode cloud untuk build aplikasi Capacitor JS Anda dan hindari kebutuhan MacOS.

Cara build aplikasi Ionic Capacitor di Xcode Cloud Capgo ilustrasi blog

Prerequisites

Sebelum lanjut ke tutorial ini…

  • Pastikan Anda menggunakan GitHub
  • Gunakan Capacitor
  • Aplikasi Anda sudah di-deploy di Apple Store
  • Ingin baca-baca dulu 😆…

Menggunakan Ionic bersifat opsional; untuk Cordova mungkin bisa, tapi saya belum mencobanya.

Info penting soal harga

Harga Xcode Cloud

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

Layanan ini ‘gratis’ hingga batas maksimal.
Anda bisa melihat harga dan limit di screenshot (harga saat tutorial dibuat, bisa berubah di masa depan)

🔴 Setelah tahu persyaratan dan harganya, kalau Anda mau, kita lanjut…

📣 Di artikel ini, kami asumsikan aplikasi sudah dibuat di Apple Store

Pendahuluan

Untuk membuat Xcode build aplikasi Capacitor Anda, Anda perlu mengatur beberapa hal.

Persiapan Paket

Pastikan perintah build Anda ada di package.json script. Lalu tambahkan sync:ios perintah seperti di bawah.

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

Langkah ini akan membuat post script berjalan dengan mudah

Skrip post-clone

Skrip ini akan dijalankan oleh Xcode Cloud setelah langkah 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

Simpan file ini di root proyek Anda dan beri nama ios/App/ci_scripts/ci_post_clone.sh

Lalu jadikan file ini executable dengan perintah ini chmod +x ios/App/ci_scripts/ci_post_clone.sh

Buat workflow Xcode

Buka Xcode (ya, untuk menghapus Xcode Anda butuh Xcode)

Lalu buka tab ini: Langkah 1 Xcode

Klik create workflow, pilih aplikasi Anda, lalu klik next seperti di bawah.

Langkah 2 Xcode

Klik Edit workflow di sebelah kiri Langkah 2 Xcode

Buka tab environments dan pilih seperti di bawah Mac 12.4, lalu centang opsi yang tepat Xcode langkah 3

Pilih kondisi awal Anda. Jika Anda menggunakan build yang sama dengan kami, saya sarankan menggunakan Tag alih-alih branch untuk menghindari build ganda.

Atur variabel env Anda Xcode langkah 4

Hubungkan akun GitHub Anda Langkah 5 Xcode

Langkah 6 Xcode

Kemudian aktifkan workflow dan commit perubahan pertama Anda, Anda akan melihat build Anda berjalan di Xcode.

Memproses Build

Di Xcode Cloud, biaya dihitung berdasarkan menit yang Anda gunakan untuk menjalankan workflow CI/CD. Berdasarkan pengalaman, butuh sekitar 10–15 menit sebelum build dapat diproses di Apple Store.

Untuk proyek privat, estimasi biaya per build bisa mencapai $0,008/menit x 5 menit = $0,4, atau lebih, tergantung konfigurasi atau dependensi proyek Anda.

Untuk proyek open-source, ini seharusnya tidak jadi masalah sama sekali. Lihat harga.

Lanjutkan dari Cara build aplikasi Ionic Capacitor di Xcode Cloud

Jika Anda menggunakan Cara build aplikasi Ionic Capacitor di Xcode Cloud untuk merencanakan otomatisasi CI/CD, hubungkan dengan CI/CD Capgo untuk workflow produk di Capgo CI/CD, Capgo Native Build untuk workflow produk di Capgo Native Builds, Integrasi Capgo untuk alur kerja produk di Integrasi Capgo, Integrasi CI/CD untuk detail implementasi di Integrasi CI/CD, dan Integrasi GitHub Actions untuk detail implementasi di Integrasi GitHub Actions.

Live updates untuk aplikasi Capacitor

Saat bug web-layer sudah live, kirim perbaikannya lewat Capgo alih-alih menunggu berhari-hari untuk persetujuan app store. Pengguna mendapat update di background, sementara perubahan native tetap mengikuti jalur review normal.

Terbaru dari Blog kami

Capgo memberikan insight terbaik yang Anda butuhkan untuk membuat aplikasi mobile yang benar-benar profesional.