# AI Code Diff Preview 类 Cursor 的 AI 代码差异预览 VSCode 插件,使用 **VSCode 内置 Diff 编辑器** + **浮动 Accept/Reject 标签**。 ## 功能特性 - ✅ **VSCode 原生 Diff 编辑器** — 使用内置 `vscode.diff`,不自定义 Webview - ✅ **EditRecord 独立追踪** — 每次 Edit/Write 独立记录,不合并 - ✅ **逐次编辑 Accept/Reject** — 细粒度控制每次 AI 修改 - ✅ **QuickPick 文件列表** — 对话结束后弹出原生文件选择器 - ✅ **快捷键导航** — `Alt+↑/↓` 跳转变更文件 - ✅ **Bug 修复** — Accept 后再编辑不再丢失追踪 - ✅ **冲突检测** — 自动检测用户手动修改导致的冲突 ## 工作流程 ``` Claude Edit/Write → 收集到 ChangeSet (EditRecord 粒度) ├── autoShowDiffPerEdit=true → 立即弹出 VSCode 内置 Diff └── autoShowDiffPerEdit=false → 静默收集,更新状态栏 Claude Stop → 变更集就绪 ├── showAllDiffsOnStop=true → QuickPick 文件列表 → 点击打开内置 Diff └── showAllDiffsOnStop=false → 仅通知,用户手动 Ctrl+Shift+D 查看 ``` ## 安装 ```bash git clone https://github.com/your-username/ai-diff-preview.git cd ai-diff-preview npm install npm run build ``` ## 使用方法 ### 快捷键 | 快捷键 | 条件 | 功能 | |--------|------|------| | `Alt+↓` | `aiDiffPreview.isActive` | 下一个变更文件 | | `Alt+↑` | `aiDiffPreview.isActive` | 上一个变更文件 | | `Tab` | `aiDiffPreview.isActive` | 接受当前编辑 | | `Esc` | `aiDiffPreview.isActive` | 拒绝所有变更 | | `Ctrl+Shift+A` | `aiDiffPreview.isActive` | Accept All | | `Ctrl+Shift+R` | `aiDiffPreview.isActive` | Reject All | | `Ctrl+Shift+D` | `aiDiffPreview.isActive` | 显示文件列表 | | `Ctrl+Shift+F` | `aiDiffPreview.isActive` | 查看当前文件 Diff | ### 配置项 | 配置项 | 类型 | 默认值 | 说明 | |--------|------|--------|------| | `aiDiffPreview.enableAutoTrigger` | boolean | true | 启用自动触发 | | `aiDiffPreview.autoShowDiffPerEdit` | boolean | false | 每次编辑自动弹 Diff | | `aiDiffPreview.showAllDiffsOnStop` | boolean | true | Stop 后弹文件列表 | | `aiDiffPreview.floatingLabelMode` | string | "statusBar" | 浮动标签位置 | | `aiDiffPreview.maxFileSize` | number | 100000 | 最大文件大小 | ## 开发 ```bash npm run watch # 监听模式 npm run test # 运行测试 (13 tests) npm run lint # 代码检查 npm run package # 打包 vsix ``` ## 项目结构 ``` src/ ├── extension.ts # 插件入口 ├── trigger/ │ └── hookHandler.ts # Hook 处理器 + QuickPick 文件列表 ├── snapshot/ │ └── snapshotManager.ts # 变更集管理器 (ChangeSetManager) ├── diff/ │ └── diffEngine.ts # Diff 计算引擎 ├── render/ │ ├── diffViewer.ts # ★ VSCode 内置 Diff 查看器 │ ├── reviewPanel.ts # Webview 面板 (次要) │ ├── inlineDecorator.ts # 内联装饰器 │ ├── codeLensProvider.ts # CodeLens 提供器 │ └── statusBar.ts # 状态栏 ├── transaction/ │ ├── acceptHandler.ts # Accept 处理器 │ └── rejectHandler.ts # Reject 处理器 └── models/ ├── types.ts # 类型定义 └── constants.ts # 常量定义 ``` ## License MIT