跳转至正文

面向 Lovable 构建者:无需 Mac,无需 Xcode

把你的 Lovable 应用变成 iOS 和 Android 应用

导出您的 Lovable 项目,使用 Capacitor 封装,并通过 Capgo Build 构建已签名的 App Store 和 Google Play 应用。无需 Mac。上线后,您在 Lovable 中做的更改会以实时更新形式推送到已安装的应用。

无需 Mac
即可进行 iOS 构建
2–3 分钟
典型 Native Build 耗时
Live Updates
针对 Lovable 中的更改

Lovable 项目

通过 Prompt 和可视化编辑构建 Web App。连接 GitHub,让 code 存放在代码仓库中。

导出并封装

Capacitor 外壳

使用 Capacitor 构建静态 dist 目录并添加 iOS 和 Android 项目。

构建和更新

Capgo 发布循环

使用 Capgo Build 构建已签名的二进制文件,然后通过 GitHub Actions 将 Web 变更作为 Live Updates 发布。

问题

Lovable 构建应用,但应用商店需要更多。

应用止步于浏览器

Lovable 项目就是一个 Web App。应用商店上架、推送通知和设备功能,都需要给它套一层原生外壳。

Lovable 无法运行原生工具链

签名、Xcode、Android Studio 和商店上传都在 Lovable 之外进行。你需要 code 和构建服务。

每次变更都要等审核

首次上架应用商店后,每个新版本都要重新走商店审核,通常 24–48 小时,有时更久。

技术栈

各工具的作用

Lovable 构建 Web 应用

通过 prompt 迭代界面、流程、文案和后端对接。生产 build 会生成一个静态 dist 文件夹,供你封装。

Capacitor 负责封装

Capacitor 使用你的 App ID、图标和权限,将构建好的 Web 应用放入原生 iOS 和 Android 项目中。code 保持不变。

Capgo 负责构建和更新

Capgo Build 会创建已签名的二进制文件并上传到应用商店。Live Updates 则把后续的 Web 变更推送到已安装的应用。

解决方案

从 Lovable 到应用商店的 Capgo 路径

Lovable 继续构建产品。Capacitor 和 Capgo 则补上 Native Build、商店上传和更新步骤。

导出到 GitHub 并 clone

在 Lovable 中连接 GitHub。Clone 仓库并确认 build 会生成包含 index.html 的 dist 文件夹。

使用 Capgo Build 构建

向 CLI 申请已签名的 iOS 和 Android build。iOS build 在云端 Mac 上运行,一次典型 build 需要 2–3 分钟。

将每次更改作为 live update 发布

开启 GitHub sync 后,Lovable 中的每次 Publish 都会推送一次 commit。GitHub Action 会构建 app 并 upload bundle,让已安装的 app 无需在应用商店发布新版本,就能获取 Web 端更改。

工作原理

Lovable 构建者如何用 Capgo 发布移动应用

从 Lovable 项目到应用商店构建和 Live Updates。这些命令你可以自己运行,也可以交给 coding agent 执行。

  1. 导出到 GitHub 并 clone

    在 Lovable 中连接 GitHub。Clone 仓库并确认 build 会生成包含 index.html 的 dist 文件夹。

    git clone https://github.com/you/your-lovable-app.git
    cd your-lovable-app
    npm install
    npm run build
    Lovable 转 Capacitor 教程
  2. 添加 Capacitor 和 Capgo

    添加原生项目,然后运行 Capgo onboarding。它会添加你的应用、创建 production channel,并安装 updater 插件。

    npm install @capacitor/core @capacitor/cli @capacitor/ios @capacitor/android
    npx cap init "Your App" com.company.app --web-dir dist
    npx cap add ios && npx cap add android
    npx @capgo/cli@latest init
    CLI onboarding 指南
  3. 在云端构建已签名的 App

    签名只需配置一次,之后即可发起 iOS 和 Android 构建。签名后的构建会上传到 App Store Connect 和 Google Play 进行审核。

    npx @capgo/cli@latest build init
    npx @capgo/cli@latest build request --platform ios
    npx @capgo/cli@latest build request --platform android
    Capgo 构建文档
  4. 将每次更改作为 live update 发布

    将 CAPGO_TOKEN 添加为 GitHub secret,并添加一个在 push 时构建并上传的 workflow。新增插件或权限仍需要重新打一次商店包。

    # step in .github/workflows, with CAPGO_TOKEN from secrets
    npm ci && npm run build
    npx @capgo/cli@latest bundle upload --channel=production --auto-bump
    GitHub Actions 集成

AI Agent Prompt

让你的 coding agent 搞定配置

拿到 Lovable code 后,把这段内容粘贴到 Claude Code、Codex 或 Cursor 这类 coding agent 中。它会安装 Capgo MCP server,添加 Capacitor 和 updater,并为签名留下 TODO,而不是凭空编造密钥。

给你的 coding agent 的 prompt

I want this project, exported from Lovable, to become a Capacitor mobile app using Capgo from the start.

Set up the project so an AI agent can use Capgo's MCP release tools through install-mcp:

1. Install the Capgo CLI MCP server for the active AI client. For Codex, run:
   - npx @capgo/cli@latest login
   - npx install-mcp 'npx @capgo/cli@latest mcp' --client codex
   Replace codex with cursor, claude-code, gemini-cli, or windsurf if that is the client this project uses.
2. Read Capgo's MCP metadata when tool details are needed (the hosted server is https://api.capgo.app/mcp):
   - https://capgo.app/.well-known/mcp/server-card.json
   - https://capgo.app/.well-known/agent-skills/capgo-cli-mcp/SKILL.md
   If this client supports agent skills, also run: npx skills add Cap-go/capgo-skills
3. Add a short docs/agent-mobile-release.md file that tells the agent to use the Capgo CLI MCP server as a local stdio server, not a remote HTTP endpoint.
4. Add Capacitor for iOS and Android using the package manager already used by this project.
5. Configure capacitor.config.ts with:
   - appName: the current Lovable app name
   - appId: a production-style bundle ID I can edit later, such as com.company.app
   - webDir: the production build output folder (usually dist)
   - plugins.CapacitorUpdater.defaultChannel: production
6. Install and configure @capgo/capacitor-updater.
7. Add package scripts for:
   - building the web app
   - syncing Capacitor
   - uploading a production Capgo bundle
   - starting Capgo Build setup for iOS
   - requesting an iOS cloud build
8. Create a first production channel plan:
   - production for users
   - preview for stakeholder review
   - staging for internal testing
9. Keep normal docs and README commands copy-pasteable with npm/npx unless this project already uses another package manager. Keep the Capgo MCP install command exactly as shown above.
10. Do not fake native signing credentials. Leave clear TODOs for the Capgo API key, Apple team details, and bundle ID.
11. After making changes, summarize exactly what changed and what command I should run next.

使用 Capacitor 构建的应用

模板与学习类产品是移动端的天然选择

创作类和学习类 App 说明,只要打包、签名和更新处理得当,Web 风格的流程也能变成可直接上架的移动端体验。

Invitation Maker Card Design 应用图标 活动

邀请函制作卡片设计

模板驱动的设计流程,能自然地从响应式网页映射到移动端。

Google Play 安装量
20.0M
应用商店评分
4.6
Infinite Japanese 应用图标 教育类

无限的日语

专注学习的应用,课程和 onboarding 的小改进会持续累积。

Google Play 安装量
180万
应用商店评分
4.6
StudySmarter - 学校与大学应用图标 教育

StudySmarter - 学校与大学

学习工作流:应用打包后仍可继续迭代 Web 产品。

Google Play 安装量
650万
应用商店评分
4.8

客户证言

使用 Capgo 交付的团队怎么说

5.0/5 开发者团队评分 9,400+ 团队 查看评价

sikafanka

设计,圆角半径 5

“Capgo Build 帮我们简化了 Capacitor 应用的发布流程。通过一套清晰的工作流,我们就能构建并发布 iOS 和 Android 应用。”

Kapil

NuTriQ 创始人

“无需等待完整的 App Store 审核周期,就能即时推送生产环境的 OTA 更新,这为我们带来了巨大的运营优势。”

Luis Dominguez 的肖像

Luis Dominguez

谁付钱,谁说了算

“自从开始使用 Capgo,一切都更快了,我也能在不耽误日常生活的情况下,把用户应得的时间留给他们。”

常见问题

Lovable 构建者常问的问题

关于将 Lovable 应用上架 App Store 和 Google Play 的简短解答。

Lovable 能直接发布到 App Store 吗?

不能。Lovable 构建的是 Web 应用。你需要导出 code,使用 Capacitor 进行封装,并通过 Capgo Build 构建签名的 iOS 和 Android 应用,然后上传至 App Store Connect 和 Google Play。

Lovable 转 Capacitor 教程

我需要 Mac 或 Xcode 吗?

不需要。Capgo Build 在云端 Mac 机器上执行 iOS 构建。你仍然需要 Apple Developer 账号才能上架 App Store,以及 Google Play 开发者账号才能发布 Android 应用。

Capgo 构建文档

我的 Lovable 项目使用 Next.js,能兼容吗?

可以,需使用静态导出。将 Capacitor 的 webDir 指向 out 文件夹而非 dist。Vite 单页应用可直接使用。

使用 Capacitor 的 Next.js

我的 Supabase 后端在 App 里还能正常工作吗?

可以。App 会像 Web 版一样通过网络调用同一个 Supabase 项目。如果使用 OAuth 登录,请把 App scheme 加到 Supabase 的 auth redirect URLs 中。

我在 Lovable 中做的更改会同步到移动 App 吗?

开启 GitHub 同步后,在 Lovable 中每次 Publish 都会推送一个 commit。对于 Web 层的更改,可以。GitHub Action 会在每次 push 时上传 bundle,已安装的 App 会下载更新。新增插件或权限仍需要新的商店 build。

GitHub Actions 集成

我的 AI agent 能处理发布步骤吗?

可以。npx @capgo/cli mcp 会启动一个本地 MCP server,Claude Code、Codex 或 Cursor 可以用它来上传 bundle、管理 channel 和发起 build。Capgo skills 会为 agent 添加 Capgo 专属指令。

Capgo MCP 服务器

把你的 Lovable App 上架到应用商店

开始 14 天免费试用,导出你的 Lovable 项目,并通过 CLI 申请你的首个 iOS 和 Android build。 选择带 14 天退款保证的方案,导出你的 Lovable 项目,并通过 CLI 申请你的首个 iOS 和 Android build。