写代码写到一半，点下运行，控制台突然蹦出一串红字——心一紧，手一抖，光标赶紧往回翻。这种场景，程序员太熟悉了。不是逻辑错了，而是连基本语法或环境都卡住了。下面这几个调试时高频报错，都是真实项目里反复踩过的坑。
1. "ReferenceError: xxx is not defined"
变量名拼错了，或者在声明前就用了。比如写了个 userName，调用时打成 username（大小写不一致），或者在 let user = '张三'; 之前就写了 console.log(user);，JS 就会直接报这个错。
console.log(userName); // ReferenceError: userName is not defined
let userName = '李四';解决办法很简单：检查拼写、确认声明位置、留意 let/const 的暂时性死区。
2. "TypeError: Cannot read property 'xxx' of undefined"
这是前端人最常看到的“undefined 错误”。本质是对象本身是 undefined，你还硬要取它的某个属性。比如接口返回数据慢了一拍，你没等数据回来就去读 data.list[0].name，结果 data 还是 undefined。
// 假设 api.getData() 返回 { list: [] }，但实际还没返回，data 是 undefined
console.log(data.list[0].name); // TypeError加个可选链操作符就行：data?.list?.[0]?.name，或者老老实实用 if (data && data.list && data.list.length) 判空。
3. "SyntaxError: Unexpected token"
少了个括号、逗号、引号，或者用了中文标点。尤其容易发生在复制粘贴配置项、JSON 字符串或模板字符串里。比如从网页复制一段 JSON，里面藏着全角冒号或引号，VS Code 看着像对的，运行就崩。
{ "name": "小王"， "age": 25 } // 注意这个逗号是中文的！打开开发者工具的 Sources 面板，红线标出的位置就是问题所在，逐个字符核对就行。
4. "Module not found: Error: Can't resolve 'xxx'"
Webpack 或 Vite 打包时抛的错，八成是包没装，或者路径写错了。比如你写了 import { debounce } from 'lodash'，但根本没执行 npm install lodash；又或者 import 路径写成 ./utils/helper.js，实际文件叫 helper.ts，而项目没配 .ts 解析规则。
先看终端报错里带不带 node_modules 字样，有就是依赖缺失；没出现，大概率是相对路径或别名配置不对。
5. "ERR_CONNECTION_REFUSED"（本地开发时）
浏览器打不开 localhost:3000，提示连接被拒绝。不是代码问题，是服务根本没起来。可能你关终端忘了重启，也可能端口被占用了。打开命令行敲 netstat -ano | findstr :3000（Windows）或 lsof -i :3000（Mac），杀掉占用进程再启动。
有时候还因为防火墙拦截、代理设置异常，甚至公司内网限制了本地服务访问——别急着重装 Node，先查服务状态。
调试不是比谁报错快，而是比谁定位准、改得稳。这些提示看着吓人，其实都是系统在“说话”，听懂它，就能省下大把挠头时间。