1. 从一句 prompt 到线上可访问这套链路到底解决了什么如果你写过前后端分离项目大概率经历过这种节奏先想清楚接口再建目录、装依赖、配数据库、调跨域、改端口、写部署脚本最后还要把服务挂到公网。每一步都不难但串起来就是半天起步。Cursor 这类 AI 编程工具的价值是把「写代码」这一段压缩成「描述需求 接受改动」而 Sealos 这类云操作系统的价值是把「跑起来 发出去」这一段压缩成「点几下 填个端口」。这篇要做的是一个 Todo List后端 Node.js Express MongoDB提供四个 RESTful 接口前端 Vue 3 Vite带亮暗模式和过滤显示数据库用 Sealos 里的 MongoDB前后端各自跑在 Sealos 的 Devbox 里最后发版拿到公网地址前端对接后端接口整条链路跑通。全程你不需要手写业务代码但需要你准确地把「环境信息」和「接口契约」喂给模型——这也是零代码生成项目最容易翻车的地方。适合谁看会一点命令行、能看懂 JSON、但不想从零搭骨架的人或者你已经会用 Cursor但每次部署都要重新查文档想把流程固定下来。下面按「先备好环境 → 再生成后端 → 再生成前端 → 对接 → 发布 → 排错」的顺序走每一步都给可复制的 prompt 和命令。2. 前置准备Sealos 里把数据库和两个 Devbox 建好2.1 创建 MongoDB 并记下连接信息登录 Sealos 控制台后在应用管理里创建一个 MongoDB 实例。创建完成后你会拿到一组连接信息形如主机test-db-mongodb.svc 用户名root 密码rm6pn7tc注意这里的test-db-mongodb.svc是集群内部的服务名Devbox 之间通过它互访不需要公网地址。密码以你实际创建的为准后面 prompt 里要替换。数据库名可以先用默认的test集合名用list。提示MongoDB 的连接串在代码里通常写成mongodb://root:密码test-db-mongodb.svc:27017/test?authSourceadmin。如果连不上优先检查authSource和端口。2.2 创建后端 Devbox在 Sealos 里新建一个 Devbox运行环境选 Node.js。创建时注意两点一是暴露端口后端我们统一用3000二是记下这个 Devbox 的名称后面发版会用到。Devbox 本质是一个带公网访问能力的开发容器你在里面跑node app.js外部就能通过它分配的公网地址访问。2.3 创建前端 Devbox同样新建一个 Devbox环境选 Node.js暴露端口用5173Vite 默认端口。前端 Devbox 和后端 Devbox 是独立的互不干扰。两个 Devbox 都创建好之后分别打开它们的终端确认node -v和npm -v能正常输出。2.4 把 Cursor 连到 DevboxCursor 本身是本地编辑器要操作 Devbox 里的文件最省事的方式是用 Cursor 的远程开发能力连上去或者直接在 Devbox 终端里用命令行创建项目、再用 Cursor 打开对应目录。无论哪种方式核心是Cursor 里看到的目录就是 Devbox 里的项目根目录。后端项目根目录已经npm init过前端项目根目录已经初始化好 Vue 3 结构这样模型才能「直接修改」而不是「从零创建」。3. 后端生成用 prompt 把接口契约写死3.1 后端 prompt 模板可直接复制把下面这段整体丢进 Cursor 的 Composer或 Chat 的编辑模式注意替换数据库连接信息请为我开发一个基于 Node.js 和 Express 框架的 Todo List 后端项目。 项目需要实现以下四个 RESTful API 接口 1. 查询所有待办事项 - 接口名: GET /api/get-todo - 功能: 从数据库的 list 集合中查询并返回所有待办事项 - 返回: 包含所有待办事项的数组 2. 添加新的待办事项 - 接口名: POST /api/add-todo - 参数: { value: string, isCompleted: boolean } - 返回: 新添加的待办事项对象包含自动生成的唯一 id 3. 更新待办事项状态 - 接口名: POST /api/update-todo/:id - 功能: 根据 id 更新指定待办事项的完成状态isCompleted 取反 - 返回: 更新后的待办事项对象 4. 删除待办事项 - 接口名: POST /api/del-todo/:id - 返回: 删除操作的结果状态 技术要求 1. 使用 Express 框架构建 API 2. 使用 MongoDB 作为数据库通过 Mongoose 进行数据操作 3. 实现适当的错误处理和输入验证 4. 使用 async/await 语法处理异步操作 5. 遵循 RESTful API 设计原则 6. 添加基本的日志记录功能 数据库连接方式 主机test-db-mongodb.svc 用户名root 密码rm6pn7tc 数据库名test 集合名list 约束 1. 直接以当前目录作为项目根目录此目录已经初始化完 Node.js 项目直接修改即可 2. 如果需要执行命令请暂停创建文件让我先执行命令 3. 为这个项目中的所有代码写上详细注释这段 prompt 的关键在于「接口契约 环境信息 约束」三件套。接口契约写死了路径、方法、参数、返回模型不会自由发挥环境信息让模型直接生成可用的连接串约束里的第 2 条尤其重要——它让模型在需要npm install时先停下来避免它自作主张执行命令导致环境混乱。3.2 执行与安装依赖模型生成完文件后按它提示的命令安装依赖npm install express mongoose morgan然后启动node app.js如果启动报错把报错信息复制回 Composer让它修复。常见的是端口占用或连接串格式问题。启动成功后在 Sealos 后端 Devbox 里获取公网地址形如https://xxxx.sealoshzh.site。3.3 生成接口测试用例拿到公网地址后用下面这段 prompt 让模型生成测试用例https://你的公网地址/ 这是我们的根地址帮我们生成这四个接口的测试用例 以及接口成功和不成功的返回值。模型会输出一组 curl 命令形如# 获取所有待办事项 curl -X GET https://你的公网地址/api/get-todo # 添加新待办事项 curl -X POST https://你的公网地址/api/add-todo \ -H Content-Type: application/json \ -d {value: 学习Node.js, isCompleted: false} # 更新待办事项状态 curl -X POST https://你的公网地址/api/update-todo/65f2e8b7c261e6001234abcd # 删除待办事项 curl -X POST https://你的公网地址/api/del-todo/65f2e8b7c261e6001234abcd注意示例里的 ID 是占位符实际测试时要先用get-todo拿到真实 ID 再替换。测试通过后把接口文档保留下来前端对接时直接复用。4. 前端生成Vue 3 Vite 的 prompt 怎么写4.1 前端 prompt 模板前端 prompt 的重点是「功能清单 UI 要求 约束」请为我开发一个基于 Vue 3 的 Todo List 应用。要求如下 1. 功能需求 - 添加新的待办事项 - 标记待办事项为完成/未完成 - 删除待办事项 - 统计待办事项完成度 - 过滤显示全部/已完成/未完成 2. UI/UX 设计要求 - 全屏响应式设计适配不同设备 - 拥有亮色模式和夜间模式 - 现代化、简洁的界面风格 - 丰富的色彩运用但保持整体和谐 - 流畅的交互动画 - 在按钮和需要的地方添加上图标 约束 1. 直接以当前目录作为项目根目录此目录已经初始化完 Vue 3 项目结构直接修改即可 2. 如果需要执行命令请暂停创建文件让我先执行命令 3. 请你根据我的需要一步一步思考给我开发这个项目特别是 UI 部分一定要足够美观和现代化模型会分步生成组件、样式和逻辑。中途它可能要求你安装依赖按提示执行npm install vueuse/core heroicons/vue tailwindcss postcss autoprefixer4.2 端口与启动配置前端 Devbox 暴露的是5173所以启动命令要带上 hostnpm run dev -- --host 0.0.0.0 --port 5173更稳妥的做法是直接改package.jsonscripts: { dev: vite --host 0.0.0.0 --port 5173, build: vite build, preview: vite preview }这样每次npm run dev都自动监听所有网卡Sealos 才能把端口映射出去。启动成功后前端 Devbox 也会分配一个公网地址。5. 前后端对接接口契约 跨域一次说清5.1 用接口文档驱动对接把后端生成的接口文档整体贴进 Cursor让模型完成请求封装下面是这个 todolist 的四个接口请完成接口对接的工作 1. 获取所有待办事项 GET https://你的后端公网地址/api/get-todo 成功响应{ success: true, data: [...] } 失败响应{ success: false, error: 获取待办事项失败 } 2. 添加新的待办事项 POST https://你的后端公网地址/api/add-todo Content-Type: application/json 参数{ value: 学习Node.js, isCompleted: false } 3. 更新待办事项状态 POST https://你的后端公网地址/api/update-todo/:id 4. 删除待办事项 POST https://你的后端公网地址/api/del-todo/:id模型会生成api.js或类似的请求模块把四个接口封装成函数并在组件里调用。5.2 跨域问题的处理前后端在不同域名下浏览器会拦截请求。最直接的方式是在后端加 CORS 中间件npm install cors然后在app.js里const cors require(cors); app.use(cors());如果只想放行特定来源可以写成app.use(cors({ origin: https://你的前端公网地址 }))。改完后重启后端前端刷新页面请求应该就能通了。5.3 前端请求 404 的排查如果前端报 404先确认三件事一是请求的 baseURL 是不是后端公网地址二是路径有没有多写或少写/api前缀三是后端是否真的在跑。用 curl 直接打后端接口能通说明后端没问题问题在前端配置不能通说明后端或端口映射有问题。6. 发布上线后端先发前端后发6.1 后端发版在 Sealos 后端 Devbox 里点击发版选择合适的服务器规格确认版本号后上线。上线完成后你会拿到一个稳定的公网地址。把这个地址提供给前端作为接口 baseURL。6.2 前端发版前端发版前先确认接口地址已经改成后端正式地址保存后再发版。同样选择规格、确认版本号、上线。上线完成后访问前端公网地址应该能看到完整的 Todo List 界面添加、完成、删除、过滤都能正常工作。6.3 验证清单发布后按这个顺序验证打开前端页面 → 添加一条待办 → 刷新页面确认数据还在说明数据库写入成功→ 标记完成 → 删除 → 切换过滤条件。全部通过说明前后端和数据库三方都通了。7. 本篇常见错误与排查后端启动报 MongoServerSelectionError多半是连接串里的主机名或authSource不对。Sealos 内部服务名要写全密码不要带特殊字符未转义。前端请求被 CORS 拦截后端没加cors中间件或origin配置写错。开发阶段可以先app.use(cors())全放行上线前再收紧。前端 404baseURL 写成了相对路径或者路径里少了/api。用浏览器开发者工具的 Network 面板看实际请求地址。端口映射不生效Devbox 暴露的端口和实际启动端口不一致。后端统一3000前端统一5173改完package.json后重启。模型生成的代码跑不起来把完整报错贴回 Composer让它基于报错修复不要自己猜。多数问题是依赖没装或版本不匹配。如果你在接入过程中需要统一管理模型调用和密钥可以看看 TaoToken 的 API Keys 页面配合接入文档把请求地址和鉴权配好想先验证模型输出效果可以直接在模型对话里试如果是长期做编码和 Agent 类任务Coding Plan会更省心。官网入口在这里。最后留一个我踩过的坑模型生成的项目结构有时会把app.js和server.js混用启动命令对不上。遇到这种情况直接看package.json里的main字段和scripts以它为准别凭记忆敲命令。