# AI应用收尾三件货，国内还没人提 现在用 Lovable、Bolt.new、v0 这类 vibe coding 平台生成一个能跑的 Web 应用，已经是海外开发者的日常操作。但中文圈讨论几乎全部集中在“怎么生成”这一步，很少有人聊**生成之后的收尾工作**：界面细节怎么改？重复操作怎么自动化？应用部署到哪？这三块恰恰是海外社区最近一年悄悄补齐的拼图，对应三个开源新工具：**Onlook、Cua、Dokploy**。这篇文章把三件货一次讲清：是什么、多少钱、和国内方案差在哪、你今天就能怎么用。看完你就能搭出一条“AI生成 → 可视化修版 → 私有部署 → 自动化运营”的完整链路，而且几乎零软件成本。 ## 一、Onlook：给 AI 生成的界面装上“设计模式” - **官网**：onlook.com｜**开源仓库**：github.com/onlook-dev/onlook - **一句话定位**：海外社区叫它 “Cursor for Designers”——一个桌面端可视化编辑器，直接打开你的 React 项目，像 Figma 一样拖拽改界面，**改完直接写回真实代码**。 AI 生成的应用最大痛点是“能用但丑”：布局差几个像素、间距不统一、品牌色不对。传统做法是你回聊天框反复用文字描述“按钮再大一点”，AI 改十次可能还不到位。Onlook 的思路完全不同——它把运行中的 React 应用渲染出来，你直接在界面框上拖：调宽度、换颜色、改字体，它反向定位到对应的 JSX/Tailwind 代码并写回仓库。改的是**代码层面的真改动**，不是截图级别的“表面效果”。 关键特性： 1. **双向绑定**：所有可视化操作最终落到 Tailwind class 和组件属性上，工程师接手无感； 2. **支持接入任意 React 项目**：不强制用某家 AI 生成器生成，v0、Lovable、Bolt 产出的代码都能导入； 3. **Git 协作**：改动以分支/提交形式回流 GitHub，设计和开发共用一条工作流； 4. **开源 + 桌面端**：项目多次登上 GitHub Trending，据公开报道为 YC 孵化项目，目前个人使用基本免费，云端协作功能收费（以官网价格页为准）。 **和国内对比**：即时设计、MasterGo 这类国产工具解决的是“画设计稿”，稿子和代码仍然是两张皮；Onlook 直接消灭“设计稿”这个中间产物。国内目前没有同类的、面向真实 React 代码库的开源可视化编辑器。 **适用人群**：用 AI 生成前端但被“改不动 UI”折磨的人；独立开发者里没有专职设计师的小团队；接外包需要快速打磨客户界面的工作室。 ## 二、Cua：让 AI 替你“动手操作电脑” - **开源仓库**：github.com/trycua/cua - **一句话定位**：开源的 Computer Use Agent 框架，主打 macOS——在本地起一个接近原生速度的沙盒虚拟机，把 Claude、OpenAI 等视觉模型接进去，让模型看屏幕、点鼠标、敲键盘，替你完成 GUI 操作。 这两年“computer use”概念很火，但大多数方案跑在云端浏览器里，只能操作网页。Cua 的差异化在于：**本地沙盒 + 全桌面范围**。它用轻量级虚拟化技术在 Mac 上跑一个隔离环境，模型在里面随便折腾——装软件、批量处理文件、操作那些没有 API 的老古董桌面软件——出了问题也污染不到你的真实系统。该项目曾在 Hacker News 上引发不少关注，对个人研究者免费开源，你只付底层模型的 API 费。 典型玩法： 1. 每天自动登录后台导出报表、整理进文件夹； 2. 批量在多个网站上执行同一套表单操作（比 RPA 脚本更抗界面改版）； 3. 让 Agent 帮你“亲手”测试刚部署的 AI 应用，截图回传验证。 **和国内对比**：国内对标是影刀 RPA、来也 UiBot 这类商业产品。区别在两点：一是 Cua 开源免费、模型驱动，靠“看屏幕理解”而不是录制回放固定坐标，网页改版不用重录脚本；二是它天然和 Claude 这类 Agent 模型配合，可以用自然语言下任务。当然，商业 RPA 在稳定性和审计上有优势，企业关键流程仍建议用成熟产品，Cua 更适合个人提效和技术尝鲜。 **适用人群**：Mac 用户；有大量“没有 API 只能点界面”的重复劳动的人；想低成本实验 computer use 的开发者。 ## 三、Dokploy：把 Vercel 的体验搬回你自己的服务器 - **官网**：dokploy.com｜**开源仓库**：github.com/Dokploy/dokploy - **一句话定位**：开源自托管 PaaS——在你任意一台 VPS 上装一下，就得到一个带 Web 界面的“私人 Vercel”：连 GitHub 仓库自动构建部署、一键装数据库、免费 HTTPS 证书、多服务器管理。 前面两步生成的 AI 应用，最后总要有个家。放 Vercel/Netlify？国内访问速度和备案都是问题；手写 Dockerfile 和 Nginx？大多数人嫌烦。Dokploy 把这条部署链路做成了点几下鼠标的事：绑定 GitHub 仓库 → 选分支 → 自动构建 → 自动签证书 → 每次 push 自动更新。还内置应用市场，PostgreSQL、Redis、n8n、Supabase 这类常用服务一键起。自托管完全免费，官方也提供托管云版本（价格以官网为准）。 **和国内对比**：国内开发者熟悉的是宝塔、1Panel 这类“服务器面板”。Dokploy 和它们的差别在基因：面板面向“管机器”（装环境、开站点），Dokploy 面向“发应用”——工作流以 Git 仓库为中心，体验对标 Vercel/Render，特别适合部署容器化应用和现代前端框架。如果你已经在用 1Panel，可以把 Dokploy 理解成“专门给应用交付用的那一层”。 **适用人群**：手上有 VPS 又想要 Vercel 体验的独立开发者；需要给客户私有化部署小应用的外包团队；想绕开海外托管平台访问不稳定问题的人。 ## 三件货串起来：一条完整流水线 ```mermaid flowchart TD A["AI生成初版应用 Lovable 或 Bolt"] --> B["代码推到 GitHub 仓库"] B --> C["Onlook 可视化修界面"] C -->|改动写回代码| B B --> D["Dokploy 绑定仓库自动部署"] D --> E["应用跑在自己服务器上"] E --> F["每天重复的后台操作"] F --> G["Cua 驱动沙盒自动执行"] G --> E ``` 这条流水线里，每一环都有免费开源方案兜底，唯一持续成本是模型 API 和一台 VPS（主流商家每月几美元档即可起步）。 ## 信息差总结 | 环节 | 你可能只知道 | 海外已经在用 | |---|---|---| | 改 AI 生成的界面 | 回聊天框反复“再大一点” | Onlook 直接拖拽写回代码 | | 没有 API 的重复操作 | 录制回放式 RPA 或人肉点击 | Cua 本地沙盒 + 视觉模型自主操作 | | 应用部署 | 宝塔装环境 / 手写 Nginx / 依赖海外托管 | Dokploy 自托管，Git push 即上线 | ## 行动指南 1. **今天就试 Onlook（15分钟）**：到 onlook.com 下载桌面版，把你手头任意一个 React 项目（或用 v0 免费生成一个）导进去，拖两下感受“改界面即改代码”； 2. **本周末部署 Dokploy（1小时）**：开一台海外 VPS，按官网安装文档一键装好，绑定你的 GitHub 仓库，把某个闲置项目迁上去跑通自动部署； 3. **按需上 Cua（半天）**：Mac 用户从 GitHub 仓库 clone 起沙盒环境，先给一个“每天重复点三次的网页操作”写自然语言任务，跑通后再扩展； 4. **回头补课 vibe coding**：如果第一步还没有现成应用，用 Lovable 或 Bolt.new 的免费额度生成一个 MVP，正好走完整条流水线。 ## 参考来源 1. Onlook 官网：https://onlook.com 2. Onlook GitHub 仓库：https://github.com/onlook-dev/onlook 3. Cua GitHub 仓库：https://github.com/trycua/cua 4. Dokploy 官网：https://dokploy.com 5. Dokploy GitHub 仓库：https://github.com/Dokploy/dokploy > 注：文中价格与免费额度均为各工具官网现行政策的概述，可能随版本调整，动手前请以官网价格页为准。 --- > 本文由「51学通信」技术团队出品。51学通信由通信行业18年老兵**爱卫生**（微信ID: gprshome201101）维护。 > 聚焦5G/6G核心网、3GPP标准、AI工具实战。知识星球「51学通信」提供深度技术答疑和行业洞察。 > [!tip] 51学通信知识星球 > **星主：爱卫生**（微信：gprshome201101）——公众号「51学通信」创办者，19 年通信行业运维与讲师经验，著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书（各大电商平台有售）。 > **星球定位**：深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域，主打运维岗位与信令分析。 > **当前规模**：5200 篇主题 / 990 个回答，198 元/年。 > **加入福利**：加入星球后请加爱卫生微信，拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题，另有群内分享。 > **AI 加持**：51学通信知识星球已作为 skill 接入 WorkBuddy，使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例，做总结、找文档和 PPT 等场景全覆盖。