AIに適切なコンテキストを与える
ここがあなたの効きどころの大半です。バグを報告するときは、次のものを含めてください。
- エラーメッセージを一字一句そのまま。 正確にコピーすること。言い換えてはいけません。エラーを言い換えるのは、電話で写真を説明するようなものです。肝心だった唯一のディテールを取りこぼします。
- スタックトレース、特に先頭の数行。
- 関連するコード — エラーを投げた関数と、それが呼び出すものすべて。
- 期待していたことと、実際に起こったこと。
強力なデバッグプロンプトの実例は、こんな感じです。
サインアップフォームを送信するとエラーが出ます。出力全体は次のとおりです:
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を誠実に保ちます。
貼り付けるトレースを 読む 方法を知っておくと役立ちます。スタックトレースは新しい順に並んだ呼び出し履歴です。先頭の行はプログラムが実際に爆発した場所で、その下の各行はその上の関数を呼び出した関数です。だから例では、validateUser は email がundefinedな何かから読み取られた場所で、handleSignup は validateUser を呼び出した側です。あなたのコードより下のフレーム — processTicksAndRejections のような — は言語ランタイムのもので、たいてい無視してかまいません。あなたの ファイルを指す最初の行に当たるまで上から下へ読みます。そこがほぼ常に見始めるべき場所です。
同じトレースを呼び出しのスタックとして読むと、順序が一目瞭然になります。クラッシュは一番上にあり、その下の各フレームは、すぐ上のフレームを呼び出した側です:
トレース読み = 呼び出しスタック
(上 = 最新) (誰が誰を呼んだか)
▲ validateUser :14 ◀── 衝突 ┌─────────────────┐ ▲ ここから
│ handleSignup :31 │ validateUser 14│ │ 見始める
│ processTicks... (ランタイム ├─────────────────┤ │ 場所
│ 無視) │ handleSignup 31│ │
│ ├─────────────────┤ │
└─ 君のコード先頭 ───────────────▶│ processTicks... │─┘ (ランタイム)
└─────────────────┘
君のファイルである最初の行に当たるまで下へ読む