~/VibeHandbook
PDF miễn phí

Chương 12 · 03

Cung cấp cho AI đúng ngữ cảnh

Đây là nơi phần lớn đòn bẩy (leverage) của bạn nằm ở đó. Khi báo cáo một bug, hãy bao gồm:

  • Thông báo lỗi, nguyên văn. Sao chép chính xác — đừng diễn giải lại. Diễn giải lại một lỗi cũng giống như mô tả một tấm ảnh qua điện thoại: bạn sẽ bỏ sót đúng chi tiết quan trọng nhất.
  • Stack trace, đặc biệt là vài dòng đầu tiên.
  • Đoạn mã liên quan — hàm đã ném ra lỗi, cộng với bất cứ thứ gì nó gọi tới.
  • Điều bạn kỳ vọng so với điều đã xảy ra.

Đây là ví dụ về một gỡ lỗi mạnh trông như thế nào:

I'm getting an error when I submit the signup form. Here's the full output:

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)

Steps to reproduce: fill in the form, click "Sign up".
Expected: a "Welcome" message.
Actual: the page goes blank and the error above appears in the console.

Here is validate.js (lines around 14):
[paste the function]

And here is the handleSignup function that calls it:
[paste the function]

What could be causing this, and how do I confirm it before changing anything?

Hãy chú ý dòng cuối cùng. Bạn đang yêu cầu một giả thuyết và một bước xác nhận, không phải một chỉnh sửa ngay lập tức. Điều đó giữ cho AI trung thực.

Sẽ hữu ích nếu bạn biết cách đọc trace mà mình vừa dán vào. Stack trace là lịch sử các lệnh gọi, mới nhất ở trên cùng: dòng trên cùng là nơi chương trình thực sự phát nổ, và mỗi dòng bên dưới là hàm đã gọi hàm ở trên nó. Vậy nên trong ví dụ này, validateUser là nơi email được đọc từ một thứ gì đó không xác định (undefined), và handleSignup là bên đã gọi validateUser. Các khung (frame) bên dưới mã của chính bạn — như processTicksAndRejections — thuộc về runtime của ngôn ngữ; bạn thường có thể bỏ qua chúng. Đọc từ trên xuống cho đến khi bạn chạm dòng đầu tiên trỏ về tệp của chính bạn, và đó gần như luôn là nơi nên bắt đầu tìm kiếm.

Cùng một trace đó, đọc như một chồng các lệnh gọi, sẽ làm rõ thứ tự. Vụ crash nằm ở trên cùng; mỗi khung bên dưới là bên gọi khung ở trên nó:

   READ THE TRACE         =        THE CALL STACK
   (top = newest)                  (who called whom)

 ▲ validateUser  :14  ◀── CRASH    ┌─────────────────┐ ▲ start
 │ handleSignup  :31               │ validateUser  14│ │ looking
 │ processTicks...     (runtime,   ├─────────────────┤ │ here
 │                      ignore)    │ handleSignup  31│ │
 │                                 ├─────────────────┤ │
 └─ your code first ──────────────▶│ processTicks... │─┘ (runtime)
                                   └─────────────────┘
   read DOWN until the first line that is YOUR file

Muốn bản ngoại tuyến?

Tải trọn cuốn sách dưới dạng PDF hoặc EPUB — miễn phí.