界面布局示意图
Code Block Review 在 VS Code 中的四个核心区域
main.ts — my-project — Visual Studio Code
📁
🔍
🌿
🧩
📄 main.ts 3
Block 1 · +12 行
Block 2 · 替换 5 行
Block 3 · -3 行
📄 utils.ts 1
Block 1 · +7 行
📄 types.ts 2
Block 1 · 替换 2 行
Block 2 · -4 行
共 6 个代码块
已审 1 / 6
⬡ main.ts
utils.ts
1import { Injectable } from '@nestjs/common'
2import { UserService } from './user.service'
3
4// ✦ Block 1 — 新增
5@Injectable()
6export class AuthService {
7 constructor(private readonly userService: UserService) {}
8 async login(dto: LoginDto) {
9 return await this.userService.findOne(dto.email)
10 }
11
12// ✦ Block 2 — 替换
13 async validateToken(token: string) {
14 return this.jwtService.verify(token)
15
16// ✦ Block 3 — 删除
17 legacyAuth() { return 'deprecated' }
18}
审查面板 6
main.ts · Block 2
第 12–14 行 · 5 行替换为 3 行
REPLACED
当前块
当前文件
审查进度1 / 6
⬡ 审查中 ● 正在捕获
6 块待审 main branch TypeScript
活动栏插件图标入口
侧边栏浏览器文件 + 代码块树形列表
编辑器内联高亮 Added / Replaced / Deleted
审查面板逐块 Accept / Reject 操作
新增行(Added)
替换行(Replaced)
删除行(Deleted)
状态栏实时显示会话状态与待审块数
交互式工作流演示
选择模式,逐步体验完整审查流程
1
开启审查会话
打开命令面板 ⌘⇧P,执行 Code Block Review: Start Review Session
> Code Block Review: Start Review Session
✓ 会话已开启,开始捕获工作区变更...
正在捕获
2
进行代码编辑
让 AI 工具(Claude Code、Copilot 等)批量修改文件,或手动进行大段改动。
+ import { JwtService } from '@nestjs/jwt'
+ async validateToken(token: string) { ... }
~ constructor signature updated (3 lines)
- legacyAuth() { return 'deprecated' }
3
停止捕获,进入审查
执行 Stop Capture And Review,插件将所有变更整理为代码块列表。
> Code Block Review: Stop Capture And Review
✓ 捕获结束,发现 6 个代码块跨 3 个文件
4
逐块 Accept / Reject
点击下方代码块卡片,选择接受或拒绝,直到全部审查完毕。
5
完成审查
接受的变更保留到工作区,拒绝的变更被撤销,会话结束。
> Code Block Review: Complete Review
正在等待...