1. 一句话需求直接开写为什么十有八九要返工你大概也干过这事脑子里冒出一个游戏点子兴奋地打开 Claude Code敲一句“帮我用 threejs 做个跑酷游戏无限地图有道具和钻石网页能玩”然后回车。Agent 立刻开始吐代码main.js、world.js、player.js一个接一个生成看起来特别顺。等你npm run dev打开浏览器才发现问题一堆主角是个方块不是牛、地图跑两步就撞墙、道具捡了没反应、分数永远显示 0。你回头改改完发现架构不对再改最后干脆删库重来。这不是模型不行是流程缺了一环。一句话需求里藏着几十个没说的决定主角长什么样、地图是直道还是转角、随机生成怎么防止死局、碰撞用几何体还是车道整数、UI 画在 canvas 还是 DOM。Agent 不会停下来问你它会用“最可能的默认值”把每个坑都填上。填对了是运气填错了就是方向性返工——不是改几行代码是整个模块推倒重来。我这次做「牛来」跑酷换了个做法写代码之前先用 grill-me 这个技能把自己烤问 10 遍。所谓 grill-me直译就是“拷问我”它是一个强制审问阶段的 Claude Code 插件核心不是帮你写代码而是在你动手之前逼你把每个模糊决定都变成明确答案。它有三条纪律一次只问一个问题不许打包成清单每个问题自带推荐答案和理由不许问“你觉得呢”能靠读代码解决的就不问。三条里第二条最关键——普通的需求澄清会甩给你一串开放问题让你填空grill-me 要求 Agent 先给出自己的判断你只需要同意、反对或修正认知负担差一个量级。这篇就把完整路径还原出来从 Vite 初始化 threejs 项目到 grill-me 的安装和真实调用方式再到那 10 个问题的清单和跑酷核心循环的验证动作。适合谁适合所有用 Claude Code、Cursor 这类 Agent 写完整功能但被“写完发现方向错了”折磨过的人。你不需要是 threejs 老手跟着做就行。2. 前置准备TaoToken 接入 Claude Code 与 grill-me 安装在开始烤问之前得先把 Claude Code 跑起来。Claude Code 本身是 Anthropic 的命令行 Agent但它的模型调用可以走兼容 Anthropic 协议的网关。我这边用的是 TaoToken它提供 Claude 系列模型的 API 接入Base URL 和 Key 配好就能用省去自己折腾账号的麻烦。官网在 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 端点是 https://taotoken.net/api 。配置 Claude Code 走这个网关最直接的方式是设环境变量。打开你的 shell 配置文件~/.zshrc或~/.bashrc加上这几行export ANTHROPIC_BASE_URLhttps://taotoken.net/api export ANTHROPIC_API_KEYsk-你的TaoToken密钥Key 在控制台的 API Keys 页面生成地址是 https://taotoken.net/console/api-keys 。生成后复制粘到上面那行。然后source ~/.zshrc让配置生效。验证一下echo $ANTHROPIC_BASE_URL # 应该输出 https://taotoken.net/api接着装 Claude Code 本体。如果你还没装npm install -g anthropic-ai/claude-code claude --version装完在项目目录里跑claude它会读环境变量里的 Base URL 和 Key。第一次进去可以敲/status看看模型连接是否正常。如果报 401八成是 Key 没配对或者环境变量没生效回头检查echo $ANTHROPIC_API_KEY有没有输出。现在装 grill-me。注意它是社区插件不在官方 marketplace 里来源是 GitHub 上的alirezarezvani/claude-skills仓库。装第三方 marketplace 等于执行别人仓库里的代码装之前值得扫一眼脚本内容——好消息是 grill-me 带的三个 python 脚本都是纯标准库、无网络、无 LLM 调用本质是正则加逐行扫描风险可控。在 Claude Code 会话里执行两条命令# 添加 marketplace /plugin marketplace add alirezarezvani/claude-skills # 安装插件user scope 全局可用 /plugin install grill-meclaude-code-skills装完落盘在~/.claude/plugins/下面结构大致是~/.claude/plugins/ ├── known_marketplaces.json # marketplace → repo 映射 ├── installed_plugins.json # 版本 / scope / gitCommitSha ├── marketplaces/claude-code-skills/ # marketplace 元数据 └── cache/claude-code-skills/grill-me/2.9.0/ # 插件实体installed_plugins.json里会记gitCommitSha这个字段有用第三方插件没有稳定版本承诺出问题时靠 sha 才能定位到当时的代码。验证装好了ls ~/.claude/plugins/cache/claude-code-skills/grill-me/2.9.0/这里有个坑必须提前说插件自己的 README 和命令定义里都写调用方式是/cs:grill-me但实际不是。Claude Code 会用插件名做命名空间真实可用的是/grill-me:cs-grill-me主技能和/grill-me:grill-me。审问需要和你来回对话所以用主技能别用 agent 模式——subagent 跑在子上下文里拿不到你的逐轮回答。3. 可复制配置Vite threejs 项目初始化与 settings 片段烤问之前项目骨架得先立起来。这次用 Vite 初始化因为它启动快、热更新稳threejs 这种需要频繁看效果的场景很合适。先建目录再初始化npm create vitelatest cow-runner -- --template vanilla cd cow-runner npm install npm install three--template vanilla是纯 JS 模板不带框架跑酷游戏用不上 React 或 Vue。装完 three 之后目录结构是标准的 Vite 布局cow-runner/ ├── index.html ├── package.json ├── vite.config.js └── src/ ├── main.js └── style.cssvite.config.js默认就够用但为了后面调试方便我加了一个 server 配置固定端口并允许局域网访问这样手机也能连上来看import { defineConfig } from vite export default defineConfig({ server: { host: 0.0.0.0, port: 5173, open: true }, build: { target: es2020, sourcemap: true } })index.html里把 canvas 容器和 UI 覆盖层都留好。跑酷游戏的 UI 我最后选了 DOM 覆盖层而不是画在 canvas 上原因是 DOM 改文字、调样式比 canvas 重绘省事太多分数、结算面板这种静态 UI 用 DOM 完全够。所以index.html的 body 里放两个东西body div idgame-container/div div idui-overlay div idscore得分: 0/div div iddiamond-count钻石: 0/div div idgame-over classhidden h2游戏结束/h2 p idfinal-score/p button idrestart再来一局/button /div /div script typemodule src/src/main.js/script /body对应的style.css里#game-container铺满视口#ui-overlay绝对定位盖在上面pointer-events: none让点击穿透到 canvas只有按钮单独开pointer-events: auto。这些是骨架具体数值后面烤问时再定。现在配 Claude Code 的项目级 settings。在项目根目录建.claude/settings.json把模型和权限固定下来避免每次会话都重新问{ model: claude-sonnet-4-20250514, permissions: { allow: [ Read, Write, Edit, Bash(npm run dev), Bash(npm run build), Bash(git status), Bash(git diff) ], deny: [ Bash(rm -rf *), Bash(git push *) ] } }这个文件路径是.claude/settings.json和全局的~/.claude/settings.json并存项目级的优先级更高。model字段指定用哪个模型permissions.allow列出允许自动执行的操作deny是硬禁止。把npm run dev和npm run build放进 allowAgent 验证构建时就不用每次等你点确认。如果你用的是 Codex 而不是 Claude Code配置落在~/.codex/auth.json和~/.codex/config.toml。auth.json 里放 Keyconfig.toml 里指定 Base URL 和 Model ID# ~/.codex/config.toml model claude-sonnet-4-20250514 model_provider taotoken [model_providers.taotoken] base_url https://taotoken.net/api wire_api chat三件套记牢Base URL 是https://taotoken.net/apiKey 从控制台拿Model ID 按你实际用的填。这三样配齐Agent 才能正常跑起来后面的烤问才有意义。4. 验证请求跑通烤问流程与跑酷核心循环配置齐了先验证 Agent 能正常对话。在项目目录里启动 Claude Codecd cow-runner claude进去之后敲一句简单的测试比如“读一下 src/main.js告诉我现在里面有什么”。如果它能正常读文件并回答说明 Base URL 和 Key 都通了。如果报local proxy failed或者连接超时回去检查环境变量如果报reading choices相关的解析错误多半是模型返回格式和客户端预期不一致换个 Model ID 试试。确认通了就进入正题。这次的需求是一句话“以最近热门电影牛来主角为模型threejs 跑酷游戏网页能玩无限地图参照神庙逃亡有道具有钻石基础 UI、得分、结算。” 注意grill-me 的三个 python 脚本全部以 markdown 方案文档为输入这次是口头一句话没有文档所以脚本一个都用不上。价值 100% 来自审问纪律本身。这不是缺陷是适用边界有方案文档就跑 extractor 和 generator一句话想法就跳过脚本直接按纪律逐个问。在 Claude Code 里调用主技能/grill-me:cs-grill-me然后把那句话需求贴进去。它会开始一次一个问题地烤问。我实际走完的 10 个问题结论整理成表序号问题结论1主角和电影 IP 什么关系原创低模牛不碰原 IP法律风险2几何体拼 vs GLTF 模型几何体省掉整条资源管线3直道 vs 神庙逃亡式转角直道4手写区块模板 vs 纯随机纯随机先跑通5随机怎么保证不出死局固定节拍 每行强制留空一道 速度封顶6Vite vs 单 HTML 文件Vite7换道插值和碰撞判定怎么做逻辑瞬切 视觉 lerp碰撞只比车道整数 Z 窗口8做哪几种道具只做磁铁 无敌9要手机触屏吗只做键盘10UI 用 DOM 还是画在 canvasDOM 覆盖层第 10 问之后用户说“先按照最简单的来”——这是明确的疲劳信号。剩下的数值细节分数公式、相机偏移、配色、手感初值我打包成一个清单让用户扫一眼而不是继续逐个问。逐个问的纪律是为了防止用户跳过难题当剩下的都是不影响架构的数值时打包才是对的。烤问结束让 Agent 按锁定的方案生成代码。4 个模块main.js、cow.js、world.js、ui.js。生成完先跑构建npm run build构建通过再起 dev servernpm run dev浏览器打开http://localhost:5173验证跑酷核心循环。核心循环要验证这几件事牛在跑、地图在滚、按左右键能换道、撞到障碍会结算、吃到钻石分数涨。我实测下来第一次跑就发现 3 个真 bug对象池按形状复用错横杆被当成钻石复用、地面段在牛身后留空洞视觉上看到地面断裂、横杆高度让滑铲专属障碍失效滑铲穿不过去。这三个都是逻辑 bug不是方向性错误改起来很快。验证换道逻辑的关键代码在cow.js里逻辑瞬切加视觉 lerp 是这样实现的// 逻辑车道是整数视觉位置用 lerp 追 update(delta) { // 逻辑瞬切按键直接改 targetLane if (this.input.left) this.targetLane Math.max(0, this.targetLane - 1) if (this.input.right) this.targetLane Math.min(2, this.targetLane 1) // 视觉 lerp当前 x 向目标车道 x 靠拢 const targetX (this.targetLane - 1) * this.laneWidth this.mesh.position.x (targetX - this.mesh.position.x) * 12 * delta // 碰撞只比车道整数 Z 窗口不用几何体求交 this.checkCollision() }碰撞判定只比车道整数和 Z 窗口不做几何体求交这是性能上的关键决定。跑酷游戏每帧要判几十个障碍几何体求交开销太大车道整数比较是 O(1)。5. 本篇常见错排查401、local proxy failed、reading choices、OAuth配环境和跑流程时最容易卡在这几个报错上。逐个说清楚原因和对策。401 Unauthorized。这是最常见的。原因通常是 Key 没配对、环境变量没生效、或者 Key 被复制时带了空格。排查顺序先echo $ANTHROPIC_API_KEY看有没有输出再看输出里有没有多余空格或换行。然后确认ANTHROPIC_BASE_URL是https://taotoken.net/api注意结尾不要多加斜杠。如果都对还是 401去控制台重新生成一个 Key 试试地址是 https://taotoken.net/console/api-keys 。还有一种情况是 Key 权限不够确认生成时勾选了模型调用权限。local proxy failed。这个报错通常出现在客户端尝试走本地代理但代理没起来的时候。如果你没配任何本地代理检查环境变量里有没有残留的HTTP_PROXY或HTTPS_PROXY有的话清掉unset HTTP_PROXY unset HTTPS_PROXY然后重启 Claude Code。如果确实需要代理确认代理进程在跑且端口对得上。这个报错和网络环境有关排查时优先看环境变量。reading choices 解析错误。这个报错说明客户端收到了模型返回但解析响应结构时失败了。常见原因是 Model ID 填错或者网关返回的格式和客户端预期不一致。先确认.claude/settings.json里的model字段是有效的模型名。如果换模型后好了就是模型名的问题如果换模型还报检查 Base URL 是不是写成了带路径的形式正确写法就是https://taotoken.net/api不要在后面加/v1之类。OAuth 相关报错。Claude Code 默认可能尝试走 OAuth 登录流程如果你用的是 API Key 模式需要确保没有触发 OAuth。检查~/.claude/下有没有残留的凭据文件有的话备份后删掉让它重新读环境变量。另外确认没有同时配 OAuth 和 API Key两者冲突时会报错。grill-me 命令找不到。如果你敲/grill-me:cs-grill-me提示命令不存在先确认插件装好了ls ~/.claude/plugins/cache/claude-code-skills/grill-me/2.9.0/。如果目录不存在重新执行/plugin install grill-meclaude-code-skills。如果目录存在但命令还是找不到重启 Claude Code 会话插件注册需要重新加载。记住真实命令是/grill-me:cs-grill-me不是文档里写的/cs:grill-me。脚本抽不出决策点。如果你有方案文档跑decision_tree_extractor.py却输出 0 个分支检查文档语言。这个脚本的信号词是英文正则well、TBD、trade-off等中文方案文档基本抽不出东西。这是这套脚本最大的实用限制。中文文档就跳过脚本直接按纪律逐个问。session tracker 用不上。grill_session_tracker.py把状态落盘在~/.grill_sessions/用于跨会话续接。单次会话内 10 个问题上下文本身就是状态额外维护 JSON 是纯开销。只有审问跨天、跨会话或者要把决策记录交给别人时才用它。排障时如果拿不准接入文档在 https://taotoken.net/doc 有更细的说明。模型对话可以在 https://taotoken.net/chat 里直接试确认模型本身能正常响应再回来排查客户端配置。6. 长期编码与 Agent 工作流把烤问变成习惯跑通一次不算什么把烤问变成写代码前的固定动作才有价值。我现在的习惯是任何超过“改几行”规模的功能动手前先跑一轮 grill-me。10 轮对话换掉一次方向性返工账很好算。如果你经常用 Agent 做长期项目可以考虑 Coding Plan它适合需要持续调用、跑 Agent 工作流的场景地址是 https://taotoken.net/coding-plan 。配合 Claude Code 的 coding-plan 模式可以把烤问、生成、验证串成一条流水线。回到 grill-me 本身真正值钱的不是那三个 python 脚本而是三条纪律一次一个问题、每个问题自带推荐答案和理由、能读代码解决的不要问。脚本只在你已经有一份英文 markdown 方案文档时才派得上用场日常那种“一句话想法”的场景纪律本身就够了。还有几条实战技巧值得记住。推荐答案要包含“我在削减你要的东西”这句话——比如用户点名要神庙逃亡的转角你推荐直道就必须说清代价转角需要路径游标状态机加局部坐标系碰撞加过弯相机世界生成复杂度约翻 2.5 倍然后把决定权交回去。藏着代价让用户“同意”一个被悄悄阉割的方案是最坏的结果。拒绝“为将来预留”的中间选项——为一个可能不来的需求把简单代码写复杂是最贵的一种预埋给二元选择加重写代价估算比给一个“两头都不得罪”的抽象层好。一个回答会强制生出新问题别跳过——用户选了纯随机就直接引出“随机加加速迟早生成死局怎么防”审问树是动态生长的不是一开始就列全的清单。停止条件也要清楚。达成共识的可操作化标准是三条每个决策分支都有答案、最近 3 个回答没有引出新问题、审问方能准确预测对方的回答。如果对方在闪避说“以后再说”没日期、说“看情况”没点名依赖、答的不是问的那个问题就用一模一样的话再问一遍躲第二次就点名。超过约 15 个问题收益递减用户表达疲劳时立刻停。这次「牛来」跑酷最终产出 4 个模块Vite 构建通过dev server 正常自查发现 3 个真 bug 但零方向性返工。顺带产出一份“被砍掉的功能加各自补回来的代价”清单转角 1-2 天、区块模板几小时、触屏约 20 行、加速和双倍分道具、暂停。下次想加的时候不用重新论证该不该做。如果你也在用 Claude Code 之类的 Agent 写完整功能最划算的改动可能就是在动手写代码前强制插入这么一段审问。先把需求问透再让 Agent 动手你会发现返工次数肉眼可见地降下来。
阅读完成 · 觉得有帮助?