Otomatisasi Capgo Live Updates dari Lovable dengan GitHub Actions

Klien Anda ingin satu tombol di Lovable untuk mengirim perubahan ke setiap pengguna aktif. Anda sudah membuktikan alur update-nya bekerja secara manual:

npx @capgo/cli@latest bundle upload --channel=production --auto-bump

Yang kurang bukanlah perintah terminal lain di dalam Lovable. Lovable tidak bisa menjalankan Capgo saat Publish. Saat sinkronisasi GitHub diaktifkan, Publish mengirimkan commit ke repo Anda. GitHub Actions menjalankan build dan bundle upload untuk Anda.

Panduan ini membahas satu-satunya setup manual yang perlu dilakukan klien sekali saja: tambahkan CAPGO_TOKEN sebagai GitHub secret. Untuk file workflow, copy-paste instruksi AI yang tersedia ke Lovable (Langkah 3).

Cara kerja pipeline

Langkah	Siapa	Apa yang terjadi
1	Klien	Edit aplikasi di Lovable dan klik Terbitkan
2	Lovable	Commit dan push ke GitHub (biasanya `main`)
3	Aksi GitHub	`npm ci`, `npm run build`, `bundle upload --auto-bump` ke Capgo
4	Capgo	Perangkat aktif pada `production` channel akan menerima update

Tanpa SSH, tanpa CLI lokal, tanpa klik tambahan setelah secret dikonfigurasi.

Prerequisites

Proyek Lovable terhubung ke GitHub (panduan ekspor)
Capacitor + @capgo/capacitor-updater di repo ("panduan Lovable ke mobile)
App terdaftar di Capgo dengan capacitor.config.ts menunjuk ke yang benar appId
production channel sudah ada dan terhubung ke build yang dijalankan user

Mengapa `--auto-bump`

Setiap upload Capgo butuh versi bundle unik baru. Lovable Publish tidak menaikkan package.json secara otomatis, jadi CI akan gagal pada deploy kedua jika Anda menggunakan versi yang sama.

--auto-bump membaca versi terbaru pada channel (atau app) dan menaikkannya. Level default adalah minor. Anda bisa mengirimkan --auto-bump patch atau --auto-bump major jika Anda mau.

Langkah 1 — Buat kunci Capgo API

Buka console.capgo.app/apikeys/
Buat kunci API dengan izin untuk upload bundle aplikasi Anda
Salin kunci ini sekali saja. Anda tidak akan bisa melihat nilai lengkapnya lagi

Perlakukan kunci ini seperti password. Jangan pernah commit ke Git atau tempel ke chat Lovable.

Langkah 2 — Tambahkan `CAPGO_TOKEN` di GitHub (satu-satunya langkah env)

Ini adalah langkah yang Anda kirim ke Kuldeep dan klien mana pun yang memiliki repo.

Buka repositori GitHub yang disinkronkan dengan Lovable
Buka Pengaturan → Secret dan variabel → Actions
Klik Secret repositori baru
Nama: CAPGO_TOKEN
Value: tempelkan key Capgo API dari Langkah 1
Simpan

GitHub menyuntikkan secret ke workflow sebagai ${{ secrets.CAPGO_TOKEN }}. Workflow di bawah ini membacanya sebagai CAPGO_TOKEN environment variable untuk Capgo CLI.

Jika repo berada di bawah organisasi klien Anda, mereka harus menambahkan secret di repo mereka. Anda hanya butuh key di GitHub, bukan di pengaturan Lovable.

Langkah 3 — Tempel prompt ini ke Lovable

Salin blok di bawah ke chat Lovable. Jika default branch Anda bukan main, ganti main di dalam workflow dengan nama branch Anda.

Add Capgo Live Updates CI with GitHub Actions.

Create `.github/workflows/capgo-live-updates.yml` (create folders if needed). Start from this YAML, then adapt install/build to this project while keeping Capgo upload + CAPGO_TOKEN secret behavior:

name: Capgo Live Updates

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v6

      - name: Setup Node.js
        uses: actions/setup-node@v6
        with:
          node-version: '24'
          cache: 'npm'

      - name: Install and build
        run: |
          npm ci
          npm run build

      - name: Upload bundle to Capgo
        run: npx @capgo/cli@latest bundle upload --channel=production --auto-bump
        env:
          CAPGO_TOKEN: ${{ secrets.CAPGO_TOKEN }}

Rules:
- Do not hardcode any Capgo API key in the repo or in chat.
- The workflow must read CAPGO_TOKEN only from GitHub Actions secrets (`${{ secrets.CAPGO_TOKEN }}`).
- Keep `--auto-bump` on the upload command so each Publish gets a new unique bundle version.
- Prefer the project's real production build script from package.json (for example `npm run build` or `vite build`).
- If package-lock.json is missing, use `npm install` instead of `npm ci`.
- Do not modify app UI or Capacitor config for this task.
- Commit the workflow file so the next Publish pushes it to GitHub.

Setelah Lovable menerapkan perubahan, klik Terbitkan agar workflow mengarah ke GitHub.

Alternatif manual

Jika Anda tidak ingin menggunakan chat Lovable, buatlah .github/workflows/capgo-live-updates.yml hanya dengan YAML ini (bukan teks prompt). Sesuaikan langkah install/build seperti aturan di atas jika proyek Anda berbeda, lalu commit dan push.

name: Capgo Live Updates

on:
  push:
    branches:
      - main

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v6

      - name: Setup Node.js
        uses: actions/setup-node@v6
        with:
          node-version: '24'
          cache: 'npm'

      - name: Install and build
        run: |
          npm ci
          npm run build

      - name: Upload bundle to Capgo
        run: npx @capgo/cli@latest bundle upload --channel=production --auto-bump
        env:
          CAPGO_TOKEN: ${{ secrets.CAPGO_TOKEN }}

Vite base path: Aplikasi Vite Lovable sering kali butuh base: './' di vite.config.ts agar aset termuat di dalam native shell. Jika user melihat layar putih setelah update OTA, minta Lovable untuk mengatur base: './', publish ulang, dan biarkan workflow melakukan redeploy.

Bundle terenkripsi: If you use enkripsi Capgo, tambahkan CAPGO_PRIVATE_KEY sebagai secret GitHub kedua dan teruskan --key-data-v2 "${{ secrets.CAPGO_PRIVATE_KEY }}" pada langkah upload.

Langkah 4 — Confirm Publish memicu deploy

Di Lovable, buat perubahan kecil yang terlihat (misalnya teks label tombol)
Klik Terbitkan
Di GitHub, buka Actions dan pantau Capgo Live Updates
Saat job sudah berwarna hijau, buka console Capgo dan konfirmasi bundle baru di production channel
Pada perangkat dengan aplikasi terinstal, pastikan perubahan sudah masuk (mungkin butuh waktu semenit tergantung pengaturan channel)

✅ Berhasil: Publish di Lovable → GitHub Action hijau → bundle baru di Capgo → user menerima update.

Pemecahan Masalah

Gejala	Kemungkinan penyebab	Perbaiki
Workflow tidak berjalan	Push masuk ke branch selain `main`	Perubahan `branches` di workflow atau publish ke `main`
`CAPGO_TOKEN` / error autentikasi	Secret hilang atau nama salah	Secret harus tepat sama dengan `CAPGO_TOKEN` di bawah Actions secrets
Version already exists	Upload menggunakan versi bundle yang sama	Pertahankan `--auto-bump` pada langkah upload (atau berikan `--auto-bump patch`)
Build gagal pada `npm ci`	Lockfile tidak sinkron	Jalankan `npm install` secara lokal, commit `package-lock.json`, publikasikan lagi
Upload berhasil, tapi layar putih	Salah `webDir` atau Vite `base`	Cocok `capacitor.config.ts` `webDir` dengan output build (`dist` untuk Vite) dan atur `base: './'`
User tidak melihat update	Channel tidak terhubung ke build mereka	Di Capgo, hubungkan device build ke `production` atau atur channel ke public

Untuk pola workflow lainnya (feature branches, PR channels, enkripsi), lihat Integrasi GitHub Actions.

Apa yang Anda sampaikan ke klien

Kirimkan checklist ini kepada mereka:

Anda sudah menghubungkan Lovable ke GitHub dan mengatur Capgo di aplikasi mobile.
Mereka menambahkan satu secret GitHub: CAPGO_TOKEN dengan Capgo API key mereka (halaman apikeys).
Mereka klik Terbitkan di Lovable kapan pun mereka ingin pengguna menerima perubahan.
Mereka tidak pernah menjalankan npx @capgo/cli secara lokal kecuali jika diinginkan.

Ini sesuai dengan pengalaman sekali klik yang mereka minta: Publish di Lovable adalah tombolnya; GitHub Actions dan Capgo menangani sisanya.

Lanjutkan

Konversi Lovable ke iOS dan Android — Setup Capacitor + Capgo lengkap jika Anda belum membungkus aplikasinya
Build dan release otomatis dengan GitHub Actions — Release berbasis tag dan kenaikan versi
Integrasi GitHub Actions — Multi-channel dan channel preview PR
Capgo Live Updates — Statistik channel, rollback, dan adopsi