3.2 侧边栏对话式编程
对话式编程不是“对着聊天框写代码”，而是把 AI 当成一个一直在侧边栏待命的助手，随时调用，随时辅助理解和修改代码。
它最有价值的地方在于：不需要切换应用、不需要复制粘贴上下文，在编辑器内部就能完成人机协作。
3.2.1 侧边栏对话的典型界面
- 聊天面板：一般在编辑器右侧或下方，可以自由拖拽宽度。
- 模型选择：可以切换不同模型（如 GPT-4、Claude 3.5、本地模型等）。
- 对话历史：保留本次会话的所有问答，可以回顾、引用或删除。
- 附件与代码块：支持粘贴代码、截图，或直接引用当前打开的文件。
3.2.2 最常用的三种交互方式
① 选中代码，直接在侧边栏提问
- 选中一段代码 → 在对话框中输入“解释这段逻辑”或“这个函数有什么潜在 bug”。
- AI 会结合选中的代码给出解释，不需要手动贴代码。
② 让 AI 直接修改代码，并预览差异
- 输入：“给这段代码加上参数校验，并改成 async/await 写法”。
- AI 生成修改后的代码，编辑器会用 diff 视图展示变更，你可以逐行确认，然后接受或拒绝。
③ 基于整个文件或项目提出需求
- 通过
@file或@folder引用当前项目文件，让 AI 了解上下文。 - 适合提出：“从 userService.ts 中提取所有 API 调用，封装成一个统一的请求模块” 这类跨文件操作。
3.2.3 提高对话效率的实用技巧
- 一次只做一件事：不要在一个问题里塞多个不相关的需求，拆分后准确度会明显提高。
- 先给约束，再提要求：例如“保持现有接口签名不变，只优化内部实现”，能避免 AI 擅自改动结构。
- 用示例说话：如果希望代码风格统一，可以先贴一段你满意的示例，再要求 AI 按此风格生成或修改。
- 分步推进复杂任务：先让 AI 给出方案，确认后再让它生成代码，避免一上来就生成整个模块导致理解偏差。
- 善用“撤销/重做”：很多侧边栏集成都支持对话操作的撤销，不满意可以随时回退，不必担心改坏。
3.2.4 真实使用场景举例
- 阅读遗留代码
打开一个老模块 → 在侧边栏输入“这个文件的主要流程是什么，有没有明显的坏味道？”
AI 快速给出结构化总结，帮助开发者迅速建立心智模型。
- 写单元测试
选中一个函数 → “为这个函数生成 3 个 Jest 测试用例，包括正常、边界和异常情况”。
一步得到可用的测试骨架，再按需微调。
- 代码重构
选中一个 200 行的函数 → “拆成 3~4 个小函数，每个只做一件事，函数名要清晰表达意图”。
观察拆分结果，进一步调整命名和逻辑划分。
- 解释报错
在控制台看到报错信息 → 粘贴到侧边栏：“这个错误是什么原因？怎么修复？”
结合项目上下文，AI 往往能给出比搜索引擎更精准的建议。
- 学习新的库或写法
“把这个 axios 请求改成用 fetch 实现，并加上超时和重试逻辑”。
直接看到实现对比，理解写法的差异。
3.2.5 注意事项
- 安全边界：不要在对话中粘贴包含密钥、内部 IP、用户数据等敏感信息的代码片段。即使侧边栏对话声称本地处理，也要假设所有内容可能被发送到服务端。
- 结果验证：AI 生成的代码必须经过人工评审和测试，不能直接上生产。
- 成本意识：频繁、大篇幅的对话可能消耗大量 token，注意观察用量。
侧边栏对话式编程不是“自动写代码”的魔法，而是一种快速反馈、高速迭代的开发方式。把它用成“第二大脑”而非“自动驾驶”，才能真正提升编程效率和质量。