krea-build

Krea Build — 面向开发者的集成模式

此技能适用于构建集成 Krea 的应用。不适用于一次性生成——那是同级技能 krea-generate 的用途，它会使用当前可用的 Krea 接入方式：已认证的 CLI 或已连接的 MCP 工具。

在以下情况使用此技能：

• 编写直接调用 Krea API 的 TypeScript/Python/Go 客户端
• 构建让用户生成内容的前端（SvelteKit、Next.js 等）
• 设计在 CI 或生产环境中运行的内容管道
• 将 Krea 输出嵌入作品集、文档或工具中

自我更新检查（可选）

每个会话运行一次；如果同级目录 ../../krea-generate/scripts/update-check.sh 存在，就运行它。如果有更新版本，会打印 UPGRADE_AVAILABLE <local> <remote>。将此信息告知用户一次，然后继续。提醒间隔依次为 24 小时→48 小时→7 天。运行 touch ~/.krea-skills/update-check-disabled 可禁用此功能。

何时使用此技能，而非同级技能

情况	使用
“帮我生成一张 X 的图片”	krea-generate
“帮我构建一个使用 Krea 的情绪板应用”	krea-build（本技能）
“写一个用于调用 Krea 的 TypeScript 辅助函数”	krea-build
“现在运行一次性管道”	krea-generate
“在我的 React 表单中添加 Krea 生成功能”	krea-build
“围绕镜头列表和 Krea 视频任务，构建动画制作 UI”	krea-build，并以 krea-animation 作为创意工作流规范
“为产品广告和 Meta 激活构建制作人仪表板”	krea-build，并以 krea-marketing 作为工作流规范

关键工作流规则：先在聊天中制作原型，再在应用中产品化

构建 Krea 应用时，最容易造成高昂代价的错误，就是围绕未经验证的生成结果编写应用代码。务必：

1. 制作原型 — 使用 krea-generate 或 krea-marketing，通过当前可用的 Krea 接入方式手动运行生成，查看实际输出效果。
2. 确认 — 向用户展示结果。调整提示词、模型和参数，直到结果符合要求。
3. 产品化 — 输出获批后，将 URL 和参数硬编码到应用中。

如果跳过第 1–2 步，直接使用占位提示词编写 SvelteKit 页面，生成失败或返回意外结果时，应用就会显得无法正常工作。在聊天中验证只需几秒；调试故障应用则需要几分钟。

完整工作流请参见 references/integration-patterns.md。

架构建议：仅在服务端运行

Krea API 密钥绝不能暴露给浏览器。所有 Krea 调用都应通过你的服务端进行：

• SvelteKit： +page.server.ts、+server.ts，或 +page.server.ts 中的 actions
• Next.js： API 路由（app/api/*/route.ts）、服务端操作，或 getServerSideProps
• Express/Hono/Fastify： 标准服务端路由

客户端通过请求你的服务端来触发生成；服务端再请求 Krea，轮询直至任务完成，并将结果流式传回。

身份验证、轮询和错误

这三项内容均位于 references/api-client.md，其中包含可复用的 TypeScript 和 Python 代码片段。关键格式如下：

• 身份验证： Authorization: Bearer ${KREA_API_KEY} 请求头。
• 提交： 使用 { prompt, ... } 请求 POST /generate/image/<model-id> -> 返回 { job_id }。
• 轮询： 每隔 3-10 秒请求一次 GET /jobs/<job_id>，直至 status 进入终态。
• 错误： 完整表格请参见 references/validation.md。

前端集成

可直接粘贴使用的 TypeScript 代码请参见 references/frontend-snippets.md，涵盖常见模式：

• 带进度 UI 的生成表单
• 点击展开的图片预览
• 带状态管理的多图片图库
• 带加载状态的视频播放器
• 硬编码的素材数组（“产品化”步骤）

验证规范

将用户提供的提示词、图片 URL 和参数值转发给 Krea 之前，必须在服务端进行验证。验证清单和内容审核处理方式请参见 references/validation.md。

参考文档

• references/integration-patterns.md — 从原型到产品化的工作流、应用结构、何时优先采用对话方式
• references/api-client.md — 身份验证、轮询、重试、错误处理（TS + Python）
• references/validation.md — 输入检查、内容审核、常见 API 错误
• references/frontend-snippets.md — 可直接粘贴到 SvelteKit/React/Vue 中的 TS 代码

快速入门

如果用户要开发一个全新的应用，并询问“如何集成 Krea”：

1. 阅读 references/api-client.md，了解身份验证和轮询的流程。
2. 将 references/frontend-snippets.md 中的 TypeScript 辅助代码放入 src/lib/krea/index.ts（或项目中合适的位置）。
3. 构建一个调用该辅助代码的服务端路由。
4. 构建一个调用该服务端路由的客户端组件。
5. 对于每个面向用户的生成任务，先在对话中使用 krea-generate 或 krea-marketing 对提示词进行原型测试，然后将获批版本硬编码。