Gitnexus WebUI可视化代码依赖关系
gitnexus仓库链接:gitnexus github
gitnexus webui 本质是“代码知识图谱浏览器”,它的核心:Code → AST → Graph → Semantic Layer → LLM
本地启动 GitNexus 的 Web UI 前后端开发环境 整个结构实际上是:
浏览器(Web UI) ↓ gitnexus-web (React/Vite 前端) ↓ HTTP/API gitnexus serve (后端/MCP/索引服务) ↓ .gitnexus 索引数据库
之前博客中介绍的gitnexus只是CLI+MCP工具 本次安装的是Web可视化界面 功能:
浏览 knowledge graph 查看 symbol dependency 搜索代码关系 可视化调用链 查看 embedding search 调试 repo index
1.1 拉取gitnexus源代码
先把 GitNexus 源码下载到本地(WebUI 目前主要以源码开发模式运行)
git clone https://github.com/abhigyanpatwari/gitnexus.git
执行后生成gitnexus/文件夹 里面含有
gitnexus/ ├── gitnexus-cli ├── gitnexus-web ├── gitnexus-shared ├── packages ├── server └── …
本地运行开发版 frontend 先进入shared公共库 (前后端共享代码,前端和后端都会使用)
cd gitnexus/gitnexus-shared
通常包含:
types api schema shared utils graph model DTO common interfaces
1.2 安装 shared package 依赖
npm install
会将如typescript、zod、tsup、eslint安装到 node_modules/下
1.3 编译 shared package
npm run build
1.4 前端Web UI项目
cd ../gitnexus-web
通常是:
React + Vite + Tailwind + Graph visualization
1.5 安装前端依赖
npm install
包括:
React: react、react-odm Vite开发服务器:vite 图可视化:cytoscape、d3、reactflow、vis-network UI: tailwind、radix、shadcn
1.6 启动前端开发服务器
npm run dev
本质是vite,启动后会看到localhost: 端口号
按住Ctrl键后鼠标单击本地地址后浏览器启动 
1.7 启动 GitNexus backend server
之后再打开另外一个终端执行下面命令
npx gitnexus@latest serve
它会读取.gitnexus、启动API Server、暴露graph query API、提供semantic search、提供MCP backend、
整体运行结构
┌────────────────────┐ │ 浏览器 │ │ localhost:5173 │ └─────────┬──────────┘ ↓ ┌────────────────────┐ │ gitnexus-web │ │ React/Vite frontend│ └─────────┬──────────┘ ↓ HTTP ┌────────────────────┐ │ gitnexus serve │ │ backend API │ └─────────┬──────────┘ ↓ ┌────────────────────┐ │ .gitnexus index │ │ graph + embeddings │ └────────────────────┘
报错了
node版本太低了,我们升级node到22 先让当前终端激活nvm
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \\. "$NVM_DIR/nvm.sh"
[ -s "$NVM_DIR/bash_completion" ] && \\. "$NVM_DIR/bash_completion"
随后安装node22
nvm install 22
安装完成后切换版本
nvm use 22
验证版本
node -v
v22.22.3
检查npm
npm -v
10.9.8
重新启动gitnexus backend 终端进入项目目录
cd your_project
建立项目代码索引
gitnexus analyze
执行
gitnexus serve
输出 MCP HTTP endpoints mounted at /api/mcp GitNexus server running on http://localhost:4747
随后看到网页中已经出现了目前gitnexus历史索引情况
随便点击一个项目进入

随便点击一个文件后显示这个文件的依赖关系,如果点击某个类或函数则显示对应的依赖关系 