PagePilot 是一个 AI 驱动的 Web 应用构建平台,用户通过自然语言描述需求,系统自动生成、运行、预览并发布完整可运行的 Web 应用。
每层用最合适的语言:Go 处理高并发 CRUD,Python 驱动 AI 推理,TypeScript 构建前端体验。
模拟用户请求"帮我创建一个 React 登录页面"的 Agent Loop 执行过程:
三级降级策略自动判断用户消息是否需要调用工具:
# 三级降级策略
FILE_TOOL_CLASSIFIER_MODE="prefer" # off | fallback | always | prefer
FILE_TOOL_CLASSIFIER_THRESHOLD=0.78 # 语义打分阈值ErrorAgent 自动诊断并修复 8 类常见构建错误:
| 错误类型 | 典型表现 | 自动修复 | 状态 |
|---|---|---|---|
| Vite host blocked | 页面空白,日志显示 blocked request | 自动修补 allowedHosts | 已解决 |
| JSX 语法错误 | 页面空白,控制台报语法错误 | 自动转义尖括号 | 已解决 |
| 入口文件缺失 | 页面空白,404 | 自动补全 index.html | 已解决 |
| npm install 失败 | 依赖安装超时或报错 | 清缓存 + 换镜像源 | 已解决 |
| HMR WebSocket 失败 | 控制台报 WebSocket 错误 | 禁用 HMR | 已解决 |
| 样式导入遗漏 | 页面无样式 | 自动注入 import | 已解决 |
| fastRefresh 失败 | React Fast Refresh 报错 | 设置 fastRefresh: false | 已解决 |
| 空白预览 | 页面完全空白 | 全链路诊断 | 已解决 |
分为四大类:文件操作、预览管理、视觉检查、脚手架与版本控制
从单轮工具调用到多轮智能调度,再到 LangGraph 多 Agent Harness
class AgentLoop:
async def run(self, messages):
llm = llm.bind_tools(tools) # 24 tools
while iteration < max_iterations: # max 26
response = await llm.ainvoke(messages)
if response.tool_calls:
for tool_call in response.tool_calls:
result = dispatch_tool(
tool_call.name,
tool_call.args
)
messages.append(
ToolMessage(content=result)
)
else:
yield StreamEvent(
type="finish",
content=response.content
)
returndef _project_id_hash_port(project_id: str) -> int:
"""同一项目始终映射到相同端口"""
h = 2166136261
for ch in project_id.encode():
h ^= ch
h = (h * 16777619) & 0xFFFFFFFF
return 31000 + (h % 1000)DOM 快照 + 截图双通道验证,确保生成结果与预期一致
两者配合:DOM 快照提供结构化信息用于精确定位,截图提供像素级信息用于样式验证。
8 类错误分类 + 4 套恢复剧本,将构建失败的用户干预率从 100% 降低到约 15%
async def fix_vite_host_blocked(project_dir):
vite_config = read_file(project_dir, "vite.config.js")
if "allowedHosts" not in vite_config:
inject_allowed_hosts(vite_config)
restart_dev_server(project_dir)async def fix_jsx_syntax_error(project_dir, error_msg):
file_path, line = parse_error_location(error_msg)
content = read_file(project_dir, file_path)
fixed = escape_angle_brackets(content)
write_file(project_dir, file_path, fixed)async def fix_npm_install(project_dir):
run_command("npm cache clean --force")
run_command(
"npm install --registry="
"https://registry.npmmirror.com"
)async def diagnose_blank_preview(dir):
checks = [
check_entry_file(dir), # index.html?
check_main_imports(dir), # main.jsx?
check_deps_installed(dir),# node_modules?
check_server_running(dir),# dev server?
check_port_available(dir),# port free?
]
return [c for c in checks if not c.passed]FNV-1a 确定性端口映射 + Docker 环境下 Vite 预览的 5 个稳定性问题自动修复
# URL 重写:适配子路径部署
/assets/index.js → /p/<id>/assets/index.js
# 自动清理策略
MAX_PER_WORKSPACE=20
TTL_DAYS=30AI 驱动的 Web 应用构建平台,让每个人都能创建完整的 Web 应用