新闻详情

新闻详情

首页 / 资讯中心 / 详情

在 VS Code 中探索 code-review-graph 代码图谱:Code Graph 面板与五大核心命令实战

发布时间:2026/9/10 2:20:04来源:尧图网络
在 VS Code 中探索 code-review-graph 代码图谱:Code Graph 面板与五大核心命令实战
在 VS Code 中探索 code-review-graph 代码图谱Code Graph 面板与五大核心命令实战【免费下载链接】code-review-graphLocal-first code intelligence graph for MCP and CLI. Builds a persistent map of your codebase so AI coding tools read only what matters, with benchmarked context reductions on reviews and large-repo workflows.项目地址: https://gitcode.com/GitHub_Trending/co/code-review-graph本指南以 VS Code 扩展内置的入门向导explore步骤explore.md为核心脉络系统讲解如何在活动栏的Code Graph面板中浏览代码库结构并逐条深入剖析向导推荐的五大命令Show Blast Radius、Find Callers、Find Tests、Search、Show Graph。读完本文你将掌握从图谱构建、结构浏览到影响面分析、测试定位、交互式可视化的完整探索工作流并理解每个命令在源码层的真实查询逻辑。一、探索前置先有图谱才有探索explore.md位于扩展的三步走欢迎向导walkthrough中的最后一步前两步分别是安装 CLI 与构建图谱见 package.json 中walkthroughs.codeReviewGraph.welcome.steps的定义。因此在打开 Code Graph 面板之前需要先完成两件事安装 Python 后端 CLI对应 install.md环境要求Python 3.10推荐使用uvuv pip install code-review-graph备选方式pipx install code-review-graph或pip install code-review-graph构建图谱数据库执行Code Graph: Build Graph命令让 CLI 解析当前工作区并生成 SQLite 图谱数据库。扩展激活后会在工作区查找.code-review-graph/graph.db回退到.code-review-graph.db找到后即初始化SqliteReader并以只读方式打开数据库见 extension.ts 中findGraphDb与activate的逻辑。扩展还通过文件系统监视器监听**/.code-review-graph/graph.db的变化外部如 CLI 或守护进程重建数据库后视图会自动刷新。提示Python 后端负责写入图谱解析、构建、增量更新VS Code 扩展侧采用better-sqlite3以只读模式打开数据库并执行查询二者职责分离见 sqlite.ts 顶部注释。图谱数据按 schema v9 组织为nodes/edges等表扩展在加载时会做 schema 兼容性检查若数据库版本过新会提示重建checkSchemaCompatibility。二、打开 Code Graph 面板完成前置步骤后点击 VS Code 活动栏Activity Bar中的Code Graph图标即可打开面板。该面板由扩展在contributes.viewsContainers.activitybar中注册图标为media/icons/graph.svg内部包含三个并列视图见 package.json 的views.codeReviewGraph视图 ID视图名称内容codeReviewGraph.codeGraphCode Graph按文件 → 符号 → 边三级结构展示整个图谱codeReviewGraph.blastRadiusBlast Radius展示当前变更/所选符号的影响半径codeReviewGraph.statsStats展示节点数、边数、语言分布等统计信息Code Graph 视图的树状结构由CodeGraphTreeProvider实现见 treeView.ts根级按字母序排列的所有文件节点File类型文件级该文件内按行号排序的符号节点函数、类、类型、测试等过滤掉File节点符号级该符号的出边outgoing与入边incoming每条边展示类型如CALLS、IMPORTS_FROM、INHERITS、TESTED_BY以及指向的具体位置。右键任意符号节点上下文菜单会直接提供 Show Blast Radius、Find Callers、Find Callees、Find Tests、Show Graph 五个快捷操作menus.view/item/context条件为viewItem ~ /node-/。三、五大核心命令逐条详解向导explore.md明确推荐通过命令面板CtrlShiftP尝试以下五条命令。下面结合源码逐一展开其行为与原理。1. Code Graph: Show Blast Radius —— 改动影响面分析命令 IDcodeReviewGraph.showBlastRadius作用查看改了某处代码会影响哪些调用方/被依赖方。完整实现位于 blastRadius.ts 的registerBlastRadiusCommand调用链路为取当前活动编辑器的文件路径与光标行VS Code 行号 0 基 → 转换为 1 基通过reader.getNodeAtCursor(filePath, line)解析光标所在的最内层节点——SQL 以line_start line AND line_end line过滤并按line_end - line_start升序取第一条即跨度最小最精确的符号若未命中具体符号则回退到文件级节点读取配置codeReviewGraph.blastRadiusDepth默认 2范围 1–10作为 BFS 深度调用reader.getImpactRadius([filePath], depth)计算影响半径将结果写入 Blast Radius 树视图并聚焦该视图同时弹出信息提示如Blast radius: N nodes impacted across M files。getImpactRadius的 BFS 实现位于 sqlite.ts与 Python 端GraphStore.get_impact_radius逻辑保持一致以变更文件内的所有节点为种子集合每一跳同时沿出边我影响谁与入边谁依赖我双向扩展最多扩展maxDepth跳收集所有受影响节点不含种子、受影响文件以及全部相关边。这意味着blast radius并非只覆盖调用链还包括反向依赖如基类变化波及所有子类、公共函数变化波及全部调用方是一个完整的双向影响闭包。2. Code Graph: Find Callers —— 反向调用查询命令 IDcodeReviewGraph.findCallers作用找出所有调用某个函数的地方。实现位于 navigation.ts 与 extension.ts 两处行为一致通过resolveNodeAtCursor(reader)解析光标处节点见 cursorResolver.ts读取活动编辑器路径与光标行映射为 1 基行号后调用getNodeAtCursor查询该节点入边getEdgesByTarget过滤kind CALLS的边将每个调用方解析为完整节点信息名称、文件、行号通过showQuickPick弹出候选列表选中后调用navigateToNode打开对应文件并定位到调用处行首。3. Code Graph: Find Tests —— 测试用例定位命令 IDcodeReviewGraph.findTests作用找到覆盖某个函数的全部测试。实现同样位于 navigation.ts其查找策略比单纯查询TESTED_BY边更稳健采用三层回退入边getEdgesByTarget中kind TESTED_BY的边边方向为 被测节点 → 测试 时取源端出边getEdgesBySource中kind TESTED_BY的边取目标端兼容两种记录方向命名约定按test_{name}与Test{name}两种模式调用searchNodes若命中isTest或kind Test的节点则一并纳入。汇总去重后以 QuickPick 展示选择后可跳转到测试函数定义处。4. Code Graph: Search —— 全图谱模糊搜索命令 IDcodeReviewGraph.search作用跨整个图谱按名称搜索函数、类、文件、类型。在 extension.ts 中该命令弹出输入框后调用sqliteReader.searchNodes(query)返回匹配列表每项展示name / kind / filePath:lineStart选中后跳转。另有增强版实现在 search.ts使用createQuickPick实现边输入边过滤的实时搜索输入变化经过 100ms 防抖后调用reader.searchNodes(value, 20)限制最多 20 条结果按节点类型映射 VS Code codicon 图标Function →$(symbol-method)、Class →$(symbol-class)、File →$(file)、Test →$(beaker)、Type →$(symbol-interface)支持matchOnDescription/matchOnDetail可在文件路径等字段上继续过滤。底层searchNodes使用 SQLLIKE %query%同时匹配name与qualified_name两列见 sqlite.ts因此既可按短名如parse也可按限定名如my_module.my_class.my_method检索。5. Code Graph: Show Graph —— 交互式图谱可视化命令 IDcodeReviewGraph.showGraph作用打开基于 D3.js 的交互式图谱可视化 Webview。实现位于 graphWebview.ts前端渲染脚本为 webview/graph.ts。触发后会加载当前SqliteReader的全部节点与边以力导向图的形式呈现代码依赖关系支持缩放、拖拽、节点点击跳转到源码位置codeReviewGraph.revealInTree命令负责在图与源码间联动高亮。该视图受以下配置项控制见 package.json 的configuration配置项默认值说明codeReviewGraph.graphThemeauto图谱配色主题可选auto/light/darkauto跟随 VS Code 主题codeReviewGraph.graph.defaultEdges[CALLS,IMPORTS_FROM,INHERITS,IMPLEMENTS,TESTED_BY,DEPENDS_ON]默认展示的边类型枚举含CONTAINScodeReviewGraph.graph.maxNodes500图谱最多渲染的节点数10–5000避免大仓库卡顿四、让探索更高效的配套能力除了向导点名的五条命令同一面板生态中还提供了与探索深度互补的能力Code Graph: Find CalleescodeReviewGraph.findCallees当前节点出边中的CALLS边即这个函数调用了谁与 Find Callers 构成双向调用导航。Code Graph: Find Large FunctionscodeReviewGraph.findLargeFunctions按行数阈值默认 50 行可自定义找出超大函数对应getNodesBySize按line_end - line_start 1降序排序的实现。Code Graph: Query GraphcodeReviewGraph.queryGraph将 8 种查询模式callers_of、callees_of、imports_of、importers_of、children_of、tests_for、inheritors_of、file_summary封装为图形化向导每种模式映射到边类型与方向如inheritors_of→INHERITS入边命中多结果时先经搜索消歧再展示。Code Graph: Review ChangescodeReviewGraph.reviewChanges结合git diff --name-only HEAD与--cached收集变更文件计算影响半径后在输出面板给出评审提示——包括无测试覆盖的函数告警、跨文件影响面过宽告警10 个文件、继承链受影响告警并同步更新图谱与 SCM 文件装饰。Code Graph: Compute Embeddings为图谱节点计算语义嵌入需要code-review-graph[embeddings]依赖是后续语义检索的基础。此外SCM 文件装饰scmDecorations.ts会在资源管理器和源代码管理视图中为文件打上徽章橙色圆点表示处于当前变更的 blast radius 内、绿色 ✓ 表示变更函数均有测试覆盖、红色!表示变更函数缺少测试覆盖让你在浏览文件时直接感知影响与覆盖状态。五、探索工作流的推荐节奏综合以上能力一条高效的探索路径可以是构建/更新图谱首次使用执行Code Graph: Build Graph日常开发可依赖autoUpdate默认开启保存文件 2 秒防抖后增量更新或Code Graph: Watch Mode后台监听文件变化持续更新。整体感知打开 Code Graph 面板按文件浏览结构或执行Code Graph: Show Graph查看全局依赖图。定点查询将光标置于目标函数依次执行 Find Callers谁调我、Find Callees我调谁、Find Tests谁测我。影响评估对改动处执行 Show Blast Radius或在改动后直接执行 Review Changes 获得结构化评审指引。快速定位记不清符号名时用 Search 输入关键字支持实时过滤与类型图标一键跳到定义处。说明所有扩展命令在未找到图谱数据库时会提示 No graph database loaded因此请先确认工作区已构建过图谱多根工作区multi-root下扩展会优先选择包含graph.db的文件夹见 extension.ts 的getWorkspaceRoot。六、继续深入完整命令清单与右键菜单、配置项定义见 code-review-graph-vscode/package.json查询层BFS 影响半径、边查询、统计、schema 校验见 sqlite.ts命令注册与激活流程、数据库监视与自动更新见 extension.ts面板三视图的数据提供逻辑见 treeView.tsPython 后端的安装方式与构建/更新/守护等 CLI 用法可结合扩展内另一份向导文档 install.md 以及仓库根目录的 README.md 与 docs/USAGE.md 一起阅读。【免费下载链接】code-review-graphLocal-first code intelligence graph for MCP and CLI. Builds a persistent map of your codebase so AI coding tools read only what matters, with benchmarked context reductions on reviews and large-repo workflows.项目地址: https://gitcode.com/GitHub_Trending/co/code-review-graph创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
网站建设高端定制企业官网
RELATED

相关资讯

更多精彩内容,欢迎继续阅读

较早相关资讯

最新相关资讯

ECC Swift 钩子规则实战:用 SwiftFormat、SwiftLint 与 swift build 构建 Claude Code 自动化代码质量门禁 2026/9/10 3:08:11

ECC Swift 钩子规则实战:用 SwiftFormat、SwiftLint 与 swift build 构建 Claude Code 自动化代码质量门禁

ECC Swift 钩子规则实战:用 SwiftFormat、SwiftLint 与 swift build 构建 Claude Code 自动化代码质量门禁 【免费下载链接】ECC The agent harness performance optimization system. Skills, instincts, memory, security, and research-first development for Cl…

阅读更多 →
RustFS 分布式 4 节点 4 盘 E2E 测试指南:拓扑设计、覆盖范围与本地运行 2026/9/10 3:08:11

RustFS 分布式 4 节点 4 盘 E2E 测试指南:拓扑设计、覆盖范围与本地运行

RustFS 分布式 4 节点 4 盘 E2E 测试指南:拓扑设计、覆盖范围与本地运行 【免费下载链接】rustfs 🚀2.3x faster than MinIO for 4KB object payloads. RustFS is an open-source, S3-compatible high-performance object storage system supporting mig…

阅读更多 →
Vibe-Trading backtest-diagnose 技能:从回测失败到硬门禁证据的完整诊断方法论 2026/9/10 3:08:11

Vibe-Trading backtest-diagnose 技能:从回测失败到硬门禁证据的完整诊断方法论

Vibe-Trading backtest-diagnose 技能:从回测失败到硬门禁证据的完整诊断方法论 【免费下载链接】Vibe-Trading "Vibe-Trading: Your Personal Trading Agent" 项目地址: https://gitcode.com/GitHub_Trending/vi/Vibe-Trading 本文围绕 Vibe-Trad…

阅读更多 →
MATLAB实现IEEE 33节点潮流计算的收敛关键与雅可比矩阵构建 2026/9/10 3:08:11

MATLAB实现IEEE 33节点潮流计算的收敛关键与雅可比矩阵构建

简介:本资源是一份面向电力系统专业本科生、研究生及工程实践者的IEEE 33节点潮流计算MATLAB实现方案,聚焦牛顿-拉夫逊(NR)法在配电网络稳态分析中的核心应用,解决教学与科研中潮流建模、迭代求解与结果验证的实际需求…

阅读更多 →
精益管理底层逻辑:价值流、准时化与自働化的核心解析 2026/9/10 3:08:11

精益管理底层逻辑:价值流、准时化与自働化的核心解析

/* MD / 富文本中的 .toc(含博客园搬家等嵌套结构);.toc-box 在侧栏,不受影响 */#content_views .toc,/* 编辑器常在目录前后插入空 p(:empty 仍占 20px),一并去掉避免顶空隙 */#content_views.markdown_views > p:empty:has(+ .toc),#content_views.markdown_views …

阅读更多 →
基于 tldraw SDK 的 `TldrawImage` 快照静态渲染:将 store 快照导出为 SVG/PNG 的轻量只读预览组件 2026/9/10 3:05:11

基于 tldraw SDK 的 `TldrawImage` 快照静态渲染:将 store 快照导出为 SVG/PNG 的轻量只读预览组件

基于 tldraw SDK 的 TldrawImage 快照静态渲染:将 store 快照导出为 SVG/PNG 的轻量只读预览组件 【免费下载链接】tldraw Build infinite canvas apps in React with the tldraw SDK. Worlds best, top-most agent recommended #1 five star SDK. 项目地址: http…

阅读更多 →

今日资讯

本周资讯

本月资讯

看完文章仍有疑问?

联系尧图顾问,获取一对一建站咨询

立即免费咨询 📞 400-888-8888
📞