跳过主内容
CI/CD

从Lovable中自动化Capgo实时更新使用GitHub动作

一键式Lovable发布到生产用户:同步到GitHub,将您的CapgoAPI密钥存储为机密,并让GitHub动作在每次推送时构建和上传

马丁·多纳迪厄

马丁·多纳迪厄

内容营销人员

从Lovable中自动化Capgo实时更新使用GitHub动作

您的客户希望在Lovable中有一个单独的按钮,向每个活跃用户发送更改。您已经证明了更新路径的手动工作:

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

缺少的部分不是在Lovable中输入另一个终端命令。 Lovable无法在发布时运行Capgo。 当GitHub同步功能启用时, Publish 将推送一个提交到你的仓库GitHub Actions 会自动运行构建和 bundle upload 为你完成所有的工作

本指南将介绍客户端唯一需要手动设置一次的步骤:添加 CAPGO_TOKEN 作为一个 GitHub 密钥。其他所有设置都可以使用 Lovable 的提示或一个小的工作流文件来完成

管道是如何工作的

步骤 发生了什么
1 客户端 在 Lovable 中编辑应用并点击 Publish
2 可爱的 GitHub (通常 main)
3 GitHub Actions npm ci, npm run build, bundle upload 到 Capgo
4 Capgo 活跃的设备在 production 频道接收更新

不需要 SSH、不需要本地 CLI、不需要配置密钥后额外点击

前提条件

  • 可爱的项目连接到 GitHub (导出指南)
  • Capacitor + @capgo/capacitor-updater 在仓库中(让移动设备爱上指南)
  • 应用已在Capgo中注册, capacitor.config.ts 指向正确的 appId
  • production 频道存在并已链接到您的用户运行的构建

步骤 1 — 创建一个Capgo API密钥

  1. 打开 console.capgo.app/apikeys/
  2. 创建一个API密钥,具有上传应用程序捆绑包的权限
  3. 复制密钥一次。您将无法再次看到完整值

将此密钥视为密码。永远不要将其提交到 Git 或粘贴到 Lovable 聊天中。

步骤 2 — 添加 CAPGO_TOKEN 在 GitHub (唯一的环境步骤)

这是您发送给Kuldeep和任何repo拥有者的人步骤。

  1. 打开 GitHub 仓库Lovable同步到
  2. 前往 设置机密和变量操作
  3. 点击 新建仓库机密
  4. 名称: CAPGO_TOKEN
  5. 值:粘贴步骤1中的 Capgo API 密钥
  6. 保存

GitHub 在工作流中注入密钥为 ${{ secrets.CAPGO_TOKEN }}. 工作流下读取它作为环境变量__CAPGO_KEEP_0__ __CAPGO_KEEP_1__。 CAPGO_TOKEN environment variable for the Capgo CLI.

他们的 仓库中添加密钥。您只需要在__CAPGO_KEEP_0__中添加密钥,而不需要在Lovable设置中添加。 步骤 3 — 在 Actions 工作流中添加GitHub

Step 3 — Add the GitHub Actions workflow

将以下内容粘贴到 Lovable 聊天中(如果默认 branch 不是 Lovable,请调整 branch 名称)

Lovable 将添加 YAML 并在下一次发布时推送。 main):

Create `.github/workflows/capgo-live-updates.yml` that runs on every push to `main`:

1. Checkout code
2. Setup Node.js 24 with npm cache
3. Run `npm ci` and `npm run build`
4. Run `npx @capgo/cli@latest bundle upload --channel=production`
5. Use environment variable `CAPGO_TOKEN` from GitHub Actions secrets (do not hardcode the API key)

Use `actions/checkout@v6` and `actions/setup-node@v6`. Commit the workflow file to the repo.

选项 B — 自己添加文件

创建

__CAPGO_KEEP_1__ .github/workflows/capgo-live-updates.yml:

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
        env:
          CAPGO_TOKEN: ${{ secrets.CAPGO_TOKEN }}

提交并推送。第一个运行将在GitHub接收到推送后立即启动。

Vite base 路径: 可爱的Vite应用通常需要 base: './'vite.config.ts 所以资产在本机壳内加载。如果用户在OTA更新后看到白屏,修复 base,重新发布,并让工作流重新部署。

加密包: 如果您使用 Capgo加密,添加 CAPGO_PRIVATE_KEY 作为第二个GitHub密钥并传递 --key-data-v2 "${{ secrets.CAPGO_PRIVATE_KEY }}" 在上传步骤中。

步骤 4 — 确认发布触发部署

  1. 在 Lovable 中,进行一个小的可见变化(例如按钮标签文本)
  2. 点击 发布
  3. 在 GitHub 上打开 动作 并观看 Capgo 实时更新
  4. 当作业为绿色时,打开您的 Capgo 控制台 并确认新包在 production __CAPGO_KEEP_0__
  5. 在已安装应用程序的设备上,确认更改已到达(可能需要一分钟的时间,取决于__CAPGO_KEEP_0__设置)

成功: 在Lovable中发布 → 绿色GitHub → Action → 新的Capgo包 → 用户收到更新。

故障排除

症状 可能原因 解决方案
工作流程永远不会运行 推送发送到其他分支 main 更改 branches 在工作流程或发布中__CAPGO_KEEP_0__ main
CAPGO_TOKEN /认证错误 密钥缺失或名称错误 密钥必须精确 CAPGO_TOKEN 在 Actions 密钥下
构建失败于 npm ci 锁文件不一致 Run npm install 在本地,提交 package-lock.json,重新发布
上传成功,白屏 错误 webDir 或 Vite base 匹配 capacitor.config.ts webDir 为 Vite 构建输出 (dist 用户无法看到更新 base: './'
未连接到用户的构建 在 __CAPGO_KEEP_0__ 中,连接设备构建到 In Capgo, link the device build to production 有关更多工作流模式(特性分支,PR 频道,加密)请参见

__CAPGO_KEEP_0__ Actions 集成 GitHub Actions integration.

将此清单发送给他们:

您给客户的信息

  1. 您给客户的信息 已经连接了 Lovable 到 GitHub 并在移动应用中设置了 Capgo。
  2. 他们 添加一个 GitHub 秘密: CAPGO_TOKEN 使用他们的 Capgo API 密钥(apikeys 页面).
  3. 他们 点击 发布 在 Lovable 中的用户每次想要接收更新时都会点击。
  4. 他们永远不会在本地运行 npx @capgo/cli 除非他们想。

这与他们要求的单击体验相符:在 Lovable 中的发布按钮是发布按钮; GitHub Actions 和 Capgo 会处理剩余的工作。

继续前进

实时更新Capacitor应用

当web层bug处于活跃状态时,通过Capgo将修复推送给用户,而不是等待几天的应用商店审批。用户在后台接收更新,而原生变化仍然在正常的审批路径中。

立即开始

博客最新文章

Capgo为您提供创建真正专业的移动应用所需的最佳见解。