如何快速上手Adorable5分钟跑通开源AI应用构建器的完整教程【免费下载链接】AdorableOpen Source Lovable项目地址: https://gitcode.com/gh_mirrors/ad/AdorableAdorable 是一个开源 AI 应用构建器Open Source Lovable你用自然语言描述想要的功能AI 就会在隔离的虚拟机里实时编写并运行代码同时提供实时预览、内置终端和一键发布上线的能力。本文面向新手带你 5 分钟完成克隆、配置、启动到第一次对话快速上手这款免费的 AI 编程工具。Adorable 是什么核心功能一览如果你想拥有一个描述需求 → 自动生成可运行应用的开源方案Adorable 就是为此而生的。它的核心能力包括对话式构建应用像聊天一样告诉 AI 你想做什么它负责写代码、改代码、跑代码实时预览 终端应用改动即时刷新终端面板可查看编译与运行日志一键发布点击右上角 Publish即可部署到生产域名项目持久化每个项目背后都是一个 git 仓库对话与历史记录跨会话保留GitHub 同步可从已有仓库创建项目并双向同步代码Adorable 快速安装5 分钟跑通步骤第一步克隆 Adorable 仓库先确认已安装 Node.js建议 18 及以上版本然后执行git clone https://gitcode.com/gh_mirrors/ad/Adorable cd Adorable/adorable第二步配置模型 API KeyAdorable 基于 Vercel AI SDK默认支持 OpenAI 与 Claude 两种模型。在项目根目录创建.env.local文件若仓库提供了.env.example直接复制一份即可写入# 默认使用 OpenAI LLM_PROVIDERopenai OPENAI_API_KEY你的OpenAI密钥 # 改用 Claude 时注释上面两行打开下面两行 # LLM_PROVIDERclaude # ANTHROPIC_API_KEY你的Anthropic密钥 切换模型只需修改LLM_PROVIDER不用动任何 UI 代码——模型链路统一封装在lib/llm-provider.ts中。第三步安装依赖npm install也支持yarn/pnpm/bun安装。第四步启动开发服务器npm run dev看到编译成功后用浏览器打开http://localhost:3000就进入了 Adorable 的主界面。上手体验用对话构建你的第一个应用界面左侧是对话区右侧是实时预览 终端面板与上文截图一致。跟着做新建一个项目每个项目会自动绑定一个 git 仓库输入一句话比如 make a simple chess appAI 会在云端沙箱 VM 中生成代码、安装依赖并启动服务右侧预览即时显示应用下方终端打印编译日志继续对话迭代加个悔棋按钮支持在线对弈满意后点击Publish一键发布上线 整个构建过程运行在 Freestyle 云端沙箱里与你的本地环境完全隔离可以放心让 AI 自由执行命令。常用目录与关键文件速查想二次开发 Adorable 本身重点看这些文件均位于adorable/目录下文件作用app/assistant.tsx聊天界面入口组装 assistant runtimeapp/api/chat/route.ts对话 API 端点串联沙箱 VM 与模型lib/llm-provider.ts模型提供商封装OpenAI / Claudelib/adorable-vm.ts沙箱 VM 规格定义lib/system-prompt.tsAI 系统提示词components/assistant-ui/thread.tsx对话线程组件components/assistant-ui/repo-sidebar.tsx仓库侧边栏常见问题 FAQQ启动后页面一直转圈或编译报错先确认.env.local中的 API Key 填写正确再重新执行npm run dev查看终端输出定位问题。Q能换成其他模型吗当前封装了 OpenAI 与 Claude 两条链路在lib/llm-provider.ts中按同样方式接入即可扩展新模型。Q项目代码和聊天记录存在哪里每个项目绑定一个 git 仓库对话消息随仓库持久化保存重启或换会话后历史不丢失。总结5 分钟四步走克隆仓库 → 配置密钥 → 安装依赖 → 启动服务。之后的一切交给对话——说出需求AI 写码运行你只负责在右侧验收、一键发布。Adorable 完全开源免费欢迎基于它的源码打造属于自己的 AI 应用构建器 【免费下载链接】AdorableOpen Source Lovable项目地址: https://gitcode.com/gh_mirrors/ad/Adorable创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考