Day 4: 修 Bug

遇到错误不要慌，Claude 是最好的调试助手。

直接贴错误信息

你：遇到这个错误：
TypeError: Cannot read property 'name' of undefined
  at UserProfile.jsx:15:8
  at render

Claude 会立刻告诉你：

你：API 报错：
Error: connect ECONNREFUSED 127.0.0.1:3306
  at Connection.connect

Claude 会分析：

你：npm run build 失败：
Module not found: Error: Can't resolve './components/Button'

Claude 会检查：

你：用户登录后，页面显示的还是登录按钮，没有显示用户名

你：页面加载很慢，首屏要等 5 秒才显示

你：在手机上看，按钮跑到屏幕外面了

你：帮我分析一下这个错误是什么原因
Claude：从错误信息看，可能是以下几个原因...

你：检查一下 user.name 是否存在
Claude：我来检查一下数据结构...

你：知道问题了，帮我修一下
Claude：我来修复这个问题...

错误类型	典型表现	快速修复
变量未定义	`ReferenceError: xxx is not defined`	检查变量名拼写，导入语句
属性不存在	`Cannot read property of undefined`	添加空值检查
异步问题	`Promise rejected`	添加 try-catch，检查 await
路径错误	`Module not found`	检查文件路径，相对/绝对路径
网络问题	`CORS error`, `Failed to fetch`	检查代理设置，API 地址

✅ 好的报错方式：
- 完整错误信息
- 出错的具体操作
- 相关代码片段
- 技术栈环境

❌ 不好的报错方式：
- "出错了"
- "不能用"
- "有问题"

你：用户点击提交按钮时出错，步骤是：
1. 填写表单
2. 点击提交
3. 页面白屏，控制台报错：...

你：开发环境正常，生产环境出错
Node.js 16.14.0
React 18.2.0
错误信息：...

你：在关键位置添加 console.log，帮我调试数据流

你：给这个函数添加参数类型检查

你：给组件添加错误处理，避免整个应用崩溃

你：页面很卡，帮我分析性能瓶颈

你：接口响应慢，帮我优化一下

你：页面用久了越来越卡，可能有内存泄漏

调试心态：bug 是正常的，每个程序员都会遇到。Claude 能快速帮你找到问题，不用自己瞎猜。

第四天完成！ 你已经学会用 Claude 快速定位和修复 bug 了。明天学习开发新功能。

Day 5: 写功能 - 从需求到代码的完整流程

练习建议：