报错不是一堵墙，它通常已经告诉你入口
先看一条完整报错
text
Uncaught TypeError: Cannot read properties of undefined (reading 'trim')
at handleSubmit (MessageForm.tsx:24:18)
at onClick (MessageForm.tsx:51:7)不要整段当成英文噪音。拆成五块：
text
Uncaught 没有被代码处理掉的错误
TypeError 使用值的方式不符合它当前的类型或状态
undefined 实际拿到的是“不存在的值”
reading 'trim' 代码却想读取它的 trim 功能
MessageForm.tsx:24 第一处值得打开的文件和行号人话翻译：第 24 行有一个值本来应该是字符串，但实际是 undefined，代码还对它调用了 .trim()。
文件、行、列怎么看
text
MessageForm.tsx:24:18表示：
text
文件 MessageForm.tsx
行 24
列 18在 Console 中通常可以点击它直接打开 Sources。构建日志中则回到编辑器打开对应文件和行号。
第一条错误为什么最重要
假设构建显示：
text
1. Cannot find module './MessageCard'
2. Property 'message' does not exist
3. Failed to render page
4. Build failed第一条“找不到 MessageCard”可能让后面三个步骤全部失败。先修最后一句 Build failed 没有意义，因为它只是总结。
调用栈不是要从头背完
text
at saveMessage (api.ts:18)
at handleSubmit (MessageForm.tsx:24)
at onClick (MessageForm.tsx:51)可以把它读成事故路线：用户点击 onClick → 进入 handleSubmit → 调用 saveMessage → 出错。
先找你项目中的文件名。框架内部的几十行调用栈可以暂时放后面。
常见英文报错人话翻译
is not defined
代码使用了一个当前作用域里不存在的名字。可能没声明、没 import，或者拼写不同。
Cannot read properties of undefined
前面的值不存在，代码却继续读取它的字段或函数。
is not a function
代码把一个普通值当成函数调用，或导入方式不正确。
Cannot find module
文件路径错误、大小写不一致、包没安装，或依赖没有记录。
Unexpected token
语法解析失败，常见是括号、引号、逗号或 JSX 结构不配对。
Failed to fetch
浏览器没能完成请求。可能是后端没启动、地址错误、网络问题或 CORS；它本身还不能确定是哪一种。
ECONNREFUSED
目标地址没有服务接受连接。常见是后端没启动或端口写错。
报错前后的环境也要记录
同一句错误在不同环境可能原因不同。交给 AI 时一起说明：
text
在哪里看到：Chrome Console
什么时候出现：点击保存留言后
本地还是线上：本地 http://localhost:5173
是否每次复现：每次都会
最后一次正常：添加登录功能以前不要只截最后一行
有效材料通常是：
- 第一条完整错误。
- 错误前后各几行日志。
- 文件名和行号。
- 复现步骤。
- Network 状态码和 Response。
不要把 API Key、Cookie、Authorization Token 和数据库密码一起贴进去。
自己先做一次最小判断
看到报错后问：
text
它在哪个窗口出现？
它指向哪个文件和行号？
它说实际拿到了什么？
代码原本期待什么？
请求有没有到下一层？这五问已经能把很多“整个网站坏了”缩成“MessageForm.tsx 第 24 行的 text 可能不存在”。
报错最后一行是 Build failed，前面第一条是 Cannot find module './Card'。应该把哪一条作为排查入口？
答案：先查 Cannot find module，因为它是第一个具体矛盾；Build failed 只是构建最终没有完成的总结。