npm installnpm run compile或者使用 watch 模式(自动编译):
npm run watch- 在 VS Code 中打开此项目
- 按
F5键启动调试 - 会打开一个新的 VS Code 窗口(扩展开发宿主窗口)
- 在新窗口中测试扩展功能
- 在新打开的扩展开发宿主窗口中,打开一个 Git 仓库
- 对某些文件进行修改(但不要提交)
方法一:通过命令面板
- 按
Cmd+Shift+P(Mac) 或Ctrl+Shift+P(Windows/Linux) - 输入 "在Git Diff中搜索"
- 选择命令
- 应该会打开搜索面板
方法二:通过 Source Control 面板
- 点击左侧边栏的 Source Control 图标
- 在 Source Control 面板的标题栏中,应该能看到搜索图标 🔍
- 点击搜索图标
- 在搜索框中输入一个关键词(例如:你修改的代码中的某个函数名或变量名)
- 点击"搜索"按钮或按 Enter 键
- 应该能看到匹配的结果,显示:
- 文件路径
- 行号
- 匹配的内容(高亮显示)
- 勾选"区分大小写"复选框
- 再次搜索,应该只匹配大小写完全相同的项
- 在另一个编辑器中修改文件
- 点击"刷新Diff"按钮
- 应该能看到最新的修改
解决方案:
- 确保已经编译了代码(
npm run compile) - 确保在扩展开发宿主窗口中测试(不是原窗口)
- 尝试重新加载窗口(
Cmd+R或Ctrl+R)
解决方案:
- 确保你在一个 Git 仓库中
- 确保有未提交的修改(修改文件但不要提交)
解决方案:
- 确保已安装 Git
- 确保 Git 在系统 PATH 中
- 在终端中运行
git --version验证
解决方案:
- 确保搜索关键词存在于 diff 中
- 检查是否勾选了"区分大小写"(如果关键词大小写不匹配)
- 尝试刷新 diff 后再搜索
- 在扩展开发宿主窗口中,打开"输出"面板(
Cmd+Shift+U或Ctrl+Shift+U) - 在下拉菜单中选择 "Git Diff Search" 或 "扩展宿主"
- 查看日志信息
- 在搜索面板中,右键点击
- 选择"检查"或"检查元素"
- 打开浏览器开发者工具,可以:
- 查看控制台错误
- 检查网络请求
- 调试 JavaScript 代码
- 创建一个包含大量修改的 diff(例如:修改了多个大文件)
- 测试搜索性能
- 检查界面响应速度
- 在代码中使用特殊字符(如:
<,>,&,",') - 测试搜索这些字符
- 确保显示正确
如果测试通过,你可以:
- 打包扩展:
vsce package - 安装到本地:
code --install-extension git-diff-search-0.0.1.vsix - 发布到 VS Code 市场(需要发布账号)