背景痛点：每天都在“搬砖”的重复劳动
如果你每天打开 VSCode 的第一件事是：
- 把 StackOverflow 的答案再抄一遍
- 在控制台和编辑器之间来回切换，只为看那一行报错
- 给祖传函数补 JSDoc，却连参数含义都看不懂
恭喜你，已经把 30% 的工时献给了“低价值重复劳动”。更尴尬的是，市面上 AI 工具不少，却总要“复制代码→切浏览器→贴提问→等回答→复制回来”，一来一回，思路早断了。能不能让 AI 就住在编辑器里，随叫随到，还不打扰专注流？这就是我最近把 ChatGPT 请进 VSCode 的初衷。
技术选型：为什么不是 GitHub Copilot？
先放结论：Copilot 擅长“补全”，ChatGPT 擅长“对话”。两者不冲突，但场景不同。
| 维度 | GitHub Copilot | ChatGPT VSCode 插件 |
|---|---|---|
| 交互方式 | 静默补全 | 对话式侧边栏 |
| 上下文长度 | 约 2k token | 8k~32k（看模型） |
| 可解释性 | 黑盒 | 可见 prompt+可调参数 |
| 自定义指令 | 不支持 | 支持模板+system prompt |
| 离线能力 | 有缓存 | 纯在线 |
当我要“一键生成带业务注释的整个函数”或“让 AI 先解释再改错”时，Copilot 常常一脸懵；而 ChatGPT 插件能把需求用自然语言说清，还能追问。最终我采用“Copilot 补全日常 + ChatGPT 攻坚+文档”的混合方案，成本低于 20 美元/月，效率却翻倍。
核心实现：把 ChatGPT 装进侧边栏
1. 插件安装与配置
- 在 VSCode 扩展商店搜索ChatGPT - Genie AI（作者：genieai）
- 安装后左侧会出现火箭图标 → 点击「Login」获取 API Key
- 打开设置 → 扩展 → Genie AI → 填入 Key，模型选
gpt-3.5-turbo-16k - 建议把Side Panel拖到右侧，形成“左码右聊”布局，减少窗口切换
截图步骤略，官方文档已很详细，重点是把 shortcut 绑定到
Ctrl+Shift+G方便随时呼出。
2. 关键 API 调用示例
下面给出两段最小可运行代码，演示如何把选中代码喂给 GPT 再写回来。为了可读性，我直接用官方openai包，实际插件内部已封装，同理。
Python：自动生成单元测试
# 选中函数后按快捷键，自动在文件末尾追加测试 import openai, os, inspect openai.api_key = os.getenv("OPENAI_API_KEY") def generate_test(func_src: str) -> str: prompt = ( "You are a pytest expert. Only reply with code, no explanation.\n" f"Write 3 unit tests for:\n{func_src}\n" "Use pytest and assert." ) resp = openai.ChatCompletion.create( model="gpt-3.5-turbo-16k", messages=[{"role": "user", "content": prompt}], temperature=0.2, # 低温度，减少幻觉 max_tokens=600, ) return resp.choices[0].message.content # 在 VSCode 终端里执行 if __name__ == "__main__": src = inspect.getsource(foo) # foo 为选中的函数 print(generate_test(src))JavaScript：一键加 JSDoc
// 选中函数 → 运行命令 → 替换 const { Configuration, OpenAIApi } = require("openai"); const fs = require("fs"); const openai = new OpenAIApi(new Configuration({ apiKey: process.env.OPENAI_KEY })); async function addJSDoc(filePath, startLine, endLine) { const linesCache = fs.readFileSync(filePath, "utf8").split("\n"); const snippet = lineCache.slice(startLine - 1, endLine).join("\n"); const prompt = `Add JSDoc comments, use @param and @returns, no other explanation.\nCode:\n${snippet}`; const response = await openai.createChatCompletion({ model: "gpt-3.5-turbo", messages: [{ role: "user", content: prompt }], temperature: 0, max_tokens: 256, }); const doc = response.data.choices[0].message.content; lineCache.splice(startLine - 1, 0, doc); // 插入注释 fs.writeFileSync(filePath, lineCache.join("\n")); }把脚本绑定到Tasks或keybindings，就能在 VSCode 里一键触发。
3. 自定义指令模板
插件支持.genie.md模板文件，放在项目根目录即可被读取。模板语法类似 Jinja2，变量用{{&selectedText}}表示。
示例：Vue 组件文档模板.genie.md
Please act as a Vue expert. Generate a README section for the following component: {{&selectedText}} Include: props, events, usage example.保存后，选中组件代码 → 右键Genie: Run Custom Prompt→ 侧边栏瞬间出现 Markdown 表格，直接贴 README，爽感爆棚。
性能优化：让 AI 答得更快、花得更少
1. 网络延迟
- 在
.vscode/settings.json里开启genieai.stream: true，首 token响应时间从 2s 降到 0.8s - 对重复提问建本地缓存：把(question, answer) 存进 SQLite，命中直接返回，不再请求。实测每天可省 15% 流量
2. Token 效率
- 选中文本超过 6k token 时，先用简单提示“Summarize the following code in 200 words”，再让 AI 针对摘要而非全文操作，能省 40% token
- 把
temperature调到 0～0.2，减少“车轱辘话” - 对同一项目维护一个
.geniecontext文件，放公共业务名词解释，作为 system prompt 的一部分，避免每次重复描述
避坑指南：少踩坑就是提效
1. 敏感代码处理
- 公司源码外传=红线。用
.gitignore把.genieignore也加进去，把含密钥、私钥、SQL 密码的文件排除 - 写 pre-commit 钩子，检测即将推送的文件是否包含
genieai临时文件，防止误提
2. 速率限制
- 免费 key 默认 3 rpm/40k tpm。超过报错
429。解决：在插件设置里把maxConcurrent调到 2，并加 500ms 指数退避重试 - 多人共用付费 key 时，给每位开发者分配独立组织 ID，账单可拆分，也避免全局限速
3. 上下文管理
- 侧边栏会话别聊太久，超过 8k token 模型会“健忘”。每解决一个任务就点「New Session」
- 把“系统级”提示（如代码规范、目录结构）写进
system prompt，用户问题放user，减少角色混淆
扩展应用：让 Git 也 AI 起来
ChatGPT 插件 + GitHub Copilot 能打出 combo：
- 写 feature 前先让 ChatGPT 生成 commit 规约模板，贴进
.gitmessage - 开发中用 Copilot 补全，写完选中 diff → 自定义 prompt “生成符合 Conventional Commits 的 message”
- 插件返一条现成
feat: add user list pagination，直接git commit -F <(echo "生成的message")
这样 commit 信息风格统一，Code Review 时队友直呼舒服。
动手实验：10 分钟搭一个“自动生成 JSDoc”工作流
目标：保存文件时，若函数缺失 JSDoc，自动补全并插入。
步骤：
- 把上面的
addJSDoc.js脚本放到项目/scripts目录 - 安装
npm i -D onchange openai - 在
package.json里加脚本：
"doc": "onchange 'src/**/*.js' -- node scripts/addJSDoc.js {{changed}}"- 运行
npm run doc，改完代码一保存，终端里看到JSDoc injected，回文件即可见注释已写好
进阶：把onchange换成 VSCodeTasks的fileWatcher，就能在 IDE 内部完成，无需切终端。
小结与下一步
把 ChatGPT 搬进 VSCode 后，我的日常“碎片式上下文切换”少了，专注时长多了，文档和测试的完成度也肉眼可见地提升。最关键的是，整个工作流可定制、可脚本化，不再被黑盒束缚。如果你也受够了“复制粘贴式 AI”，不妨把今天提到的缓存、模板、钩子都玩一遍，相信会有同样的爽感。
想亲手搭一个更完整的“语音+对话”AI 项目？我最近在火山引擎的从0打造个人豆包实时通话AI动手实验里，把 ASR、LLM、TTS 串成了一条超低延迟的 Web 通话链路，步骤清晰，连 Node 小白都能跑通。写完代码再让 AI 自己帮你写文档，闭环成就感爆棚，值得一试。
