Lompat ke Konten Utama
Tutorial

Cara Membangun Aplikasi Capacitor di Xcode Cloud

Gunakan Xcode Cloud untuk membangun aplikasi Capacitor JS Anda dan menghindari kebutuhan MacOS.

Martin Donadieu

Martin Donadieu

Pengembang Konten

Cara Membangun Aplikasi Capacitor di Xcode Cloud

Persyaratan

Sebelum melanjutkan dengan tutorial…

  • Pastikan Anda menggunakan GitHub
  • Gunakan Capacitor
  • Aplikasi Anda sudah terdistribusi di App Store Apple
  • Keinginan untuk membaca 😆…

Menggunakan Ionic tidak wajib, untuk Cordova mungkin bisa berfungsi, tapi saya belum mencobanya.

Hal penting tentang harga

Harga Xcode Cloud

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

Pelayanan ini adalah ‘gratis’ hingga batasnya.
Anda bisa melihat di screenshot harga dan batasan (harga sesuai dengan pembuatan tutorial, mereka mungkin mengalami perubahan di masa depan)

🔴 Setelah diingatkan tentang persyaratan dan harga, jika Anda suka, kita melanjutkan…

📣 Dalam postingan ini, kita asumsikan bahwa kita telah memiliki aplikasi yang dibuat di App Store Apple

Intro

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

Paket Persiapan

Pastikan Anda memiliki perintah build di skrip Anda. package.json Lalu tambahkan perintah seperti di bawah ini. sync:ios Langkah ini akan membuat skrip post bekerja dengan sederhana.

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

Skrip Pasca Kloning

Skrip ini akan dieksekusi oleh Xcode Cloud setelah langkah kloning.

Simpan file ini di root proyek Anda dan beri nama

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

Lalu buat file ini executable dengan perintah ini. ios/App/ci_scripts/ci_post_clone.sh

Buat Alur Kerja Xcode chmod +x ios/App/ci_scripts/ci_post_clone.sh

Langkah ini akan membuat skrip post bekerja dengan sederhana.

Mulai Xcode (ya, untuk menghapus Xcode Anda memerlukan Xcode)

Dan pergi ke tab ini : Langkah Xcode 1

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

Langkah Xcode 2

Klik pada Edit workflow di sebelah kiri Langkah Xcode 2

Pergi ke tab lingkungan dan pilih seperti di bawah Mac 12.4 dan centang opsi yang tepat Langkah Xcode 3

Pilih kondisi awal Anda. Jika Anda menggunakan build yang sama dengan kami, saya sarankan menggunakan Tag daripada cabang, untuk menghindari build ganda.

Setel variabel lingkungan Anda Langkah Xcode 4

Hubungkan akun GitHub Anda Langkah Xcode 5

Langkah Xcode 6

Kemudian, aktifkan alur kerja dan komit perubahan pertama Anda, Anda harus melihat proses build Anda berjalan di Xcode.

Proses Build

Dalam Xcode Cloud, Anda dikenakan biaya berdasarkan menit Anda telah digunakan untuk menjalankan alur kerja CI/CD Anda. Dari pengalaman, membutuhkan sekitar 10–15 menit sebelum build dapat diproses di App Store.

Untuk proyek pribadi, biaya perkiraan per build dapat mencapai $0,008/min x 5 menit = $0,4, atau lebih, tergantung pada konfigurasi atau dependensi proyek Anda.

Untuk proyek Open-source, hal ini tidak akan menjadi masalah sama sekali. Lihat Pricing.

Teruskan dari Cara Membuat Aplikasi Capacitor di Xcode Cloud

Jika Anda menggunakan Cara Membuat Aplikasi Capacitor di Xcode Cloud Untuk merencanakan otomatisasi CI/CD, hubungkannya dengan Capgo CI/CD untuk alur kerja produk di Capgo CI/CD, Capgo Pembangunan Natively untuk alur kerja produk di Capgo Pembangunan Natively, Capgo Integrasi for the product workflow in Capgo Integrations, untuk alur kerja produk di __CAPGO_KEEP_0__ Integrasi, untuk detail implementasi di Integrasi CI/CD, dan GitHub Integrasi Aksi untuk detail implementasi di GitHub Integrasi Aksi

Pembaruan Langsung untuk Aplikasi Capacitor

Ketika ada bug layer web yang hidup, kirimkan perbaikan melalui Capgo daripada menunggu hari-hari untuk persetujuan toko aplikasi. Pengguna mendapatkan pembaruan di latar belakang sementara perubahan native tetap dalam jalur review normal.

Dukungan Manusia dari Martin

Mulai Sekarang

Terbaru dari Blog Kami

Capgo memberikan Anda wawasan terbaik yang Anda butuhkan untuk menciptakan aplikasi mobile profesional yang sebenarnya.