与你的 AI 助手一起构建 QORM 应用
QORM 面向智能体:让你的 AI 编码助手(Claude Code、Claude Desktop、Cursor、Windsurf……) 指向它,由 AI 来搭建、编辑、运行并验证 QORM 应用——然后与你实时协作一个运行中的应用。 这是工作流中属于人的一侧。
先看效果
60 秒版本:scripts/demo.sh 会开一个共享会话并按脚本自动做一串 AI 编辑——打开打印出的 URL、按下录制,就能看到应用实时变化 + 「AI edited」提示:
./scripts/demo.sh # examples/counter
./scripts/demo.sh examples/dashboard快速开始（分二步向 Agent 提问）
无需任何复杂的手动配置。只需将以下两句提示词依次投递给你的 AI 编码助手（ChatGPT、Claude Code、Cursor、Windsurf、Antigravity、DeepSeek、Kimi……）：
提示词 1 (载入框架与技能):
请加载 QORM 框架的 MCP 配置与 Skill 技能库（https://github.com/qorm/qorm），搭好环境，保持 DevTool 可见。
提示词 2 (新建并构建应用):
使用 QORM 在 ./myapp 创建应用，启动原生窗口，然后根据以下需求构建应用：<在此输入你的应用想法，例如：带连续打卡天数的习惯追踪器>。qorm run ./myapp 会自动检测并生成缺失的目录脚手架、启动实时 HTTP 服务与 MCP 接口，并自动在当前系统弹出原生独立可执行程序窗口。如果明确需要网页浏览器标签页，可附加 --web 参数。
实时人机协作如何工作
- 你在浏览器里点击：AI 通过
qorm_activity实时感知你的行为。 - AI 实时编辑：代码文件热更新或经由 MCP 变更，改动即刻呈现在你的浏览器中，并带 "AI edited" 提示。
- 自我验证：AI 会使用
qorm check/qorm measure验证布局与状态正确性。
完整闭环见人机协作。
设计令牌（让 AI 守住配色）
你可以在 qorm.json 中声明一套设计令牌系统，让 AI 的样式编辑守在你的设计 系统之内，而不是漂移到任意颜色。加一个可选的 designTokens 映射——每一项都是一个 有名称、有类型的值：
"designTokens": {
"color.primary": { "type": "color", "value": "#0a84ff", "enforce": true },
"color.bg": { "type": "color", "value": "#f2f2f7", "enforce": true },
"spacing.md": { "type": "number", "value": 16, "enforce": false }
}type——color、number……（值以字符串形式存储；16→"16"）。enforce—— 在硬约束与建议之间的开关。
令牌如何进入界面。 渲染时每个令牌都会生成一个 stage 作用域的 CSS 变量: color.primary → --qorm-token-color-primary(点号转为连字符)。场景用 var(...) 引用它们,与内置主题变量(var(--accent))完全同一通道:
{ "type": "card", "style": { "background": "var(--qorm-token-color-primary)" } }因此你声明的调色板既是 AI 的围栏,也是应用真实的样式通道——改一个令牌, 所有引用随之更新。
它如何约束智能体。 当你把一个 color 令牌标为 enforce: true 时， qorm_apply_patch（以及无副作用的 qorm_preview_patch）会拒绝任何将颜色样式 ——color、background、backgroundColor、borderColor——设为非你所声明的 enforce 颜色令牌值的 setProp style 操作。拒绝是一条清晰的、列出允许值的错误，例如：
design token violation: color "#ff0000" is not an allowed token (allowed: #0a84ff, #f2f2f7)比较时会对十六进制大小写与前导 # 做归一化，因此 #0A84FF、0a84ff 和 #0a84ff 都匹配同一个令牌。
enforce: false的令牌是建议性的——会暴露给智能体，但绝不拦截。- 一个未声明
designTokens（或没有 enforce 颜色令牌）的应用行为与以往完全一致
——不受任何约束。
智能体通过 qorm_inspect 发现你的令牌——它现在会返回一个 designTokens 字段， 从而在编辑前就知道自己被允许使用哪些值。可运行的声明示例见 gallery 示例。
好用的提示词
- "在设置场景里加一个深色主题开关,并验证布局。"
- "这个按钮在移动端溢出了——量一下并修正宽度。"
- "把任务行改造成一个可复用组件。"
- "把它打包成一个可安装的 web 应用。"