实战：从零构建本地 Code Review 插件

本文将带你利用 Ollama 和 VS Code 插件开发 技术，打造一个完全本地化、无需联网的 Code Review 工具。

我们将采用 VS Code Extension + Node.js + Ollama 的架构。对于前端工程师而言，这几乎没有什么学习成本。

如果你不了解Ollama 是什么，请先去官网或者我的上一篇文章进行一个简单的了解。

第一步：安装前置依赖

在动手写代码前，先准备好必需的运行环境。

安装 Ollama ：前往 Ollama 官网下载并安装。
下载模型 ：打开终端，拉取一个适合代码任务的模型。这里推荐 deepseek-coder，它在代码理解和生成方面表现优异。

ollama pull deepseek-coder:6.7b
验证运行
- 输入 ollama run deepseek-coder:6.7b，跟它打个招呼，比如问它"你好"，确保它能回复。如果这一步通了，按 Ctrl+D 退出对话模式，保持后台运行即可。

第二步：搭建插件骨架

我们需要利用 Yeoman 生成器快速创建一个 TypeScript 版的 VS Code 插件项目。

安装脚手架
css 复制代码
```
npm install -g yo generator-code
```
生成项目
css 复制代码
```
yo code
```
然后会有一堆选项，按照下面这样选择：
- ? What type of extension do you want to create? -> New Extension (TypeScript)
- ? What's the name of your extension? -> ai-code-reviewer (自己起个名字)
- ? What's the identifier of your extension? -> (直接回车默认)
- ? What's the description of your extension? -> (直接回车或随便写)
- ? Initialize a git repository? -> Yes
- ? Which bundler to use? -> webpack
- ? Which package manager to use? -> npm
进入目录并安装依赖
bash 复制代码
```
cd ai-code-reviewer
npm install
```
安装 Ollama SDK
复制代码
```
npm install ollama
```

第三步：编写核心逻辑

核心逻辑非常简单：获取完整当前文件代码 -> 封装 Prompt -> 调用 Ollama -> 输出结果。

注册命令

在 package.json 的 contributes 中添加命令配置，使其出现在编辑器右键菜单中：

json 复制代码

"contributes": {
  "commands": [{ "command": "ai-code-reviewer.review", "title": "AI Code Review" }],
  "menus": {
    "editor/context": [{ "command": "ai-code-reviewer.review", "group": "navigation" }]
  }
}

实现交互逻辑

在 src/extension.ts 中编写如下代码：

TypeScript 复制代码

import * as vscode from 'vscode';
import ollama from 'ollama';

// This method is called when your extension is activated
// Your extension is activated the very first time the command is executed
export function activate(context: vscode.ExtensionContext) {
    const disposable = vscode.commands.registerCommand('ai-code-reviewer.review', async () => {
        // 1. 获取当前打开的编辑器
		const editor = vscode.window.activeTextEditor;
		if (!editor) {
			vscode.window.showErrorMessage('没有打开的编辑器!');
			return;
		}

		// 2. 获取当前文件的内容
		const document = editor.document;
		const code = document.getText();

		// 3. 创建一个输出面板（模拟对话框）
		const outputChannel = vscode.window.createOutputChannel('AI Code Review');
		outputChannel.show(true);
		outputChannel.appendLine('正在分析代码...');
		
		try {
			// 4. 调用 Ollama API 进行代码分析
			const stream = await ollama.chat({
				model: 'deepseek-coder:6.7b', // 替换为你的 Ollama 模型名称
				messages: [
					{ role: 'system', content: '你是一个代码审查专家，请用中文审查以下代码，指出潜在的 Bug、逻辑错误、性能问题并提供改进建议。' },
					{ role: 'system', content: `
					// 		你是一位专注的代码审查专家。请以极简主义方式审查代码，遵循以下规则：

					// 		核心原则：
					// 		1. 仅关注致命错误、逻辑Bug或严重性能问题
					// 		2. 无严重问题时，仅回复"通过"
					// 		3. 回复总字数严格控制在300字内
					// 		4. 禁止任何开场白、结束语或非必要说明

					// 		输出格式：
					// 		- [问题]：一句话描述问题
					// 		- [修正]：修正代码示例

					// 		注意：
					// 		- 使用中文回复
					// 		- 直接切入重点，无需寒暄
					// 		- 按问题严重程度排序
					// 		- 保持专业、简洁、精确
					// 	`
					// },
					{ role: 'user', content: code }
				],
				stream: true
			});

			for await (const chunk of stream) {
                            outputChannel.append(chunk.message.content);
			}
			outputChannel.appendLine('\n--------------------------------------------------');
			vscode.window.showInformationMessage('✅ 代码审查完成！请查看输出面板获取详细反馈。');

		} catch (error) {
			console.error('调用 Ollama API 失败:', error);
			vscode.window.showErrorMessage('调用 Ollama API 失败，请检查控制台日志获取更多信息。');
			outputChannel.appendLine('调用 Ollama API 失败，请检查控制台日志获取更多信息。');
		}
	});

	context.subscriptions.push(disposable);
}

// This method is called when your extension is deactivated
export function deactivate() {}

第四步：运行与调试

在 VS Code 中按下 F5（或者在菜单栏选择运行-->启动调试）。

此时会打开一个新的 VS Code 窗口。
在新窗口中打开任意代码文件。
点击鼠标右键，选择 AI Code Review。

如果一切顺利，你将看到底部输出面板中逐字打印出 AI 的审查建议。

提示词调优：如何驯服"啰嗦"的 AI

目前为止我们给 AI 设定的 Prompt 只有一句：

你是一个代码审查专家，请用中文审查以下代码，指出潜在的 Bug、逻辑错误、性能问题并提供改进建议。

它回复了满满一大屏：

"这段代码写得非常不错，结构清晰，逻辑也比较严谨。但是在某些细节上还有优化的空间...（省略 500 字客套话）...希望这些建议对你有帮助。"

这显然不符合 Code Review 追求高效的初衷。我们需要的是干货。为了解决这个问题，我进行了三次提示词迭代：

尝试一：角色设定负面约束

不要只说"你是专家"，要明确告诉他不要做什么。

markdown 复制代码

`你是一位拥有10年经验的资深工程师，以代码审查严厉、犀利但切中要害著称。 请审查用户提供的代码，严格遵守以下规则： 
1. **直接找茬**：忽略客套话和赞美，不要说"代码写得不错"等废话。
2. **关注核心问题**：仅报告潜在的 Bug、逻辑错误、安全漏洞、严重的性能问题或反模式。
3. **具体且可执行**：每个问题必须给出具体的修改建议和修正后的代码片段。

输出格式要求：
如果发现问题：
- **[严重程度: 高/中/低]** 问题简述 
- 原因：为什么会出问题
- 建议：一句话解决方案 
- 修正代码： \`\`\`语言 // 你的修正代码 \`\`\`

如果没有发现明显问题：
仅回复一行："代码逻辑无明显问题，建议关注边界情况测试。"`

效果：AI 确实少了很多客套话，但有时仍会输出过长的分析。

尝试二：字数硬限制

"回复总字数严格限制在 300 字以内。"

效果：输出变得精简了很多。

尝试三：格式强制

强迫 AI 按照结构输出，它就没有空间去"水"字数。

"如果没问题，仅回复'通过'。如果有问题，严格按照格式：[问题]: 描述... [修正]: 代码..."

最终，通过组合上述策略，我们得到了文章第三步中注释掉的那个Prompt。这再次证明，好的 AI 工具离不开精心设计的提示词工程。

markdown 复制代码

你是一位专注的代码审查专家。请以极简主义方式审查代码，遵循以下规则：

核心原则：
1. 仅关注致命错误、逻辑Bug或严重性能问题
2. 无严重问题时，仅回复"通过"
3. 回复总字数严格控制在300字内
4. 禁止任何开场白、结束语或非必要说明

输出格式：
- [问题]：一句话描述问题
- [修正]：修正代码示例

注意：
- 使用中文回复
- 直接切入重点，无需寒暄
- 按问题严重程度排序
- 保持专业、简洁、精确

结语

这个插件虽然简单，但它标志着一个重要的转变：我们开始从单纯的AI用户转变为AI应用的开发者。