~/VibeHandbook
免费 PDF

12 · 03

给 AI 喂正确的上下文

这是你大部分杠杆所在之处。当你报告一个 bug 时,请包含:

  • 逐字的错误信息。 原样复制——不要转述。转述一个错误,就像在电话里描述一张照片:你会漏掉那个最关键的细节。
  • 堆栈跟踪,尤其是顶部的几行。
  • 相关代码——抛出错误的函数,以及它调用的任何东西。
  • 你期望的结果与实际发生的结果对比。

下面是一个强力调试提示的真实样子:

我提交注册表单时报错了。下面是完整的输出:

TypeError: Cannot read properties of undefined (reading 'email')
    at validateUser (src/auth/validate.js:14:23)
    at handleSignup (src/routes/signup.js:31:10)
    at processTicksAndRejections (node:internal/process/task_queues:95:5)

复现步骤:填好表单,点击 "Sign up"。
期望:一条 "Welcome" 消息。
实际:页面变成空白,上面这个错误出现在控制台里。

这是 validate.js(第 14 行附近):
[粘贴这个函数]

这是调用它的 handleSignup 函数:
[粘贴这个函数]

什么可能导致这个,以及在改动任何东西之前我该如何确认它?

注意最后一行。你是在请求一个假设和一个确认步骤,而不是立即修改。这能让 AI 保持诚实。

知道如何阅读你正在粘贴的那段跟踪,会很有帮助。堆栈跟踪是一份按最新到最旧排列的调用历史:最顶部那行是程序实际爆炸的地方,下面每一行都是调用了它上面那个函数的函数。所以在例子里,validateUseremail 从某个 undefined 的东西上被读取的地方,而 handleSignup 是调用 validateUser 的那一方。你自己代码下面的帧——比如 processTicksAndRejections——属于语言运行时;通常你可以忽略它们。从上往下读,直到碰到第一行指向你的文件,那几乎总是该开始查看的地方。

把同一段跟踪当作一摞调用来读,顺序就一目了然了。崩溃在最顶上,下面每一帧都是调用了它正上方那一帧的那一方:

   读跟踪                 =          调用栈
   (顶 = 最新)                       (谁调用了谁)

 ▲ validateUser  :14  ◀── 崩溃     ┌─────────────────┐ ▲ 从这里
 │ handleSignup  :31               │ validateUser  14│ │ 开始
 │ processTicks...     (运行时,   ├─────────────────┤ │ 查看
 │                      忽略)      │ handleSignup  31│ │
 │                                 ├─────────────────┤ │
 └─ 你的代码在前 ─────────────────▶│ processTicks... │─┘ (运行时)
                                   └─────────────────┘
   向下读,直到第一行是你的文件

想离线阅读?

免费下载整本书的 PDF 或 EPUB。