// docs / section-generation
Section 生成
站点 UI 的主路径已收敛为:单一 architect_agent 拟定全局 chrome, 再由每个页面的 page_implement_agent 工具闭环编写 page.tsx 及页面级组件。下文描述该路径及与之配套的 Hero skill 发现; 历史上的「逐文件 generate_section 批量步骤」不再作为主路径。
概览
核心实现见 ai/flows/generate_project/runGenerateProject.ts 中的 generatePages → ai/flows/generate_project/steps/pageImplementAgent.ts 内的 runPageImplementAgent。plan_project 已为每页写入 pageDesignPlan(叙事、层级、约束), Agent 以 design-system、预读的 layout.tsx / globals.css、目录树与用户旨意为上下文, 自主决定拆分哪些组件文件,并以工具调用落盘;收尾必须调用 page_implementation_complete。
上游:规划与数据
plan_project(提示词见 ai/flows/generate_project/prompts/steps/planProject.agent.md)把「仅有页面、尚无 section」的蓝图, 扩展为 PlannedProjectBlueprint:为每个页面推导 sections[],并为每个 section 挂上 designPlan。
plan_project 与 analyze_project_requirement 都不负责预先指定全局 chrome。编排与并行
apply_project_design_tokens 与 architect_agent 必须先于任意 page_implement_agent 完成,以避免 globals / layout 竞态。 全部页面的 Page Agent 在 Architect 结束后用 Promise.all 并行启动; 每页步骤名为 page_implement_agent:{slug},拓扑与日志中可按 slug 区分。
Hero 运行时 Skill
当策略判定需要为首页 Hero 注入额外特效指引时,会在该页 Agent 启动前调用 discoverAndSelectSkill(内部候选来自技能清单 + 关键词 fallback), 仅将选中技能的正文注入该页 Agent 的 user 消息;这不是全局步骤,也不替代用户在前端选择的 styleGuide(后者走设计系统生成)。
// runGenerateProject.ts — 每页并行
const pageOutcomes = await Promise.all(
blueprint.site.pages.map((page) =>
runPageImplementAgent({ page, designSystem, projectContext, heroSkillPrompt, ... })
)
);单次页面的 Prompt
System:分层拼接
Page Implement Agent 的 system 由 frontend.md、steps/pageImplementAgent.md 以及 shared/agentRuleBundles.ts 指定的 prompts/rules/*.md(tailwindMappingGuide、section.default、outputTsx 等)顺序拼接。可按环境变量 PAGE_IMPLEMENT_AGENT_EXTRA_RULES 追加规则 id。
User:契约 + 任务
User 消息包含完整 design-system.md、序列化后的 pageDesignPlan、站点路由与项目语境,以及预先注入的只读快照: 当前 app/layout.tsx、app/globals.css、components/ 与 app/ 的目录树摘要。 若存在 Hero skill 正文,则一并附加。详见 Prompt 拼装 Trace。
验证与重试
Agent 工具写入的文件仍会经过统一的格式化(如 Prettier);路由级错误主要由后续的 typecheck_generated、run_build 与 repair_build 捕获。
next build(除非排查具体错误),全局验证由流水线统一调度。下游组装
Page Agent 负责目标路由文件及其拆出的组件;全局 shell 已由 Architect 锁定。 流水线在全部页面完成后执行依赖安装、可选范围类型检查与生产构建。
更完整的步骤序号与并行关系见 AI 生成流水线。