流量跟踪器
跟踪代码在多个存储库中流动。用英语提问，获得美人鱼图+逐步解释。
You: "How does order creation work?"
FlowTracer: [mermaid diagram showing Frontend → API → Backend → DB across all repos]
+ step-by-step explanation with file paths and function names适用于 任何语言 （TypeScript、Haskell、Python、Go、Java、Rust等）和 任意数量的repo.
快速开始
选项A:MCP服务器（建议Claude Code用户使用）
# Add to Claude Code (one-time)
claude mcp add flow-tracer -- npx flow-tracer
# Then in Claude Code, just say:
# "Register repos /path/to/frontend and /path/to/backend"
# "How does the checkout flow work?"选项B：Web用户界面
npx flow-tracer serve
# Open http://localhost:3847
# Enter repo paths, ask questions, see diagrams in browser选项C：克隆并在本地运行
git clone
cd flow-tracer
npm install
node bin/flow-tracer.js serve # web UI
# or
node bin/flow-tracer.js mcp # MCP server认证
FlowTracer需要访问Claude模型。两种选择：
选项1:Claude Code Pro（无需设置）
如果你有一个Claude Code订阅，它会自动工作——使用 claude CLI在引擎盖下。
选项2：无烟煤API密钥
- 首选 console.anthropic.com
- 注册/登录
- 首选 设置>API密钥
- 点击 创建密钥
- 复制密钥（以开头
sk-ant-api03-...)
# Set the key
export ANTHROPIC_API_KEY=sk-ant-api03-...
# Then run
npx flow-tracer serve新帐户获取 $5免费积分每个问题的成本：约3.5美分。
可选环境变量：
ANTHROPIC_API_KEY=sk-ant-... # Required if no Claude CLI
FILE_SELECT_MODEL=claude-haiku-4-5-20251001 # Cheap model for file picking (default)
ANALYSIS_MODEL=claude-sonnet-4-20250514 # Quality model for analysis (default)
PORT=3847 # Web UI port (default)运作原理
1. REGISTER: You give it repo paths. It scans all files and builds a
compact manifest (function signatures + imports for each file).
2. ASK: You ask a question. Two LLM calls happen:
Call #1 (fast): LLM reads the manifest and picks 15-25 relevant files
Call #2 (deep): LLM reads those files and generates diagrams + explanation
3. FOLLOW UP: Ask more questions — the conversation context is preserved.关键见解：我们让LLM读取函数签名和导入，以了解每个文件的功能，然后选择正确的文件，而不是关键字匹配文件路径（这会错过关键文件）。
MCP工具
当用作MCP服务器时，FlowTracer会公开：
| 工具 | 说明 |
|---|---|
register_repos | 将repo路径注册到索引。先叫这个。 |
trace_flow | 问一个关于代码流的问题。返回美人鱼+解释。 |
follow_up | 使用之前的对话背景回答后续问题。 |
list_repos | 列出所有已注册的回购组。 |
项目结构
flow-tracer/
├── bin/flow-tracer.js # CLI entry point (mcp or serve)
├── src/
│ ├── mcp.js # MCP server (for Claude Code/Desktop)
│ ├── server.js # Express web server (browser UI)
│ ├── indexer.js # Repo scanner + LLM-guided file selection
│ ├── llm.js # Claude integration (CLI + API dual mode)
│ ├── summarizer.js # Builds file manifest (signatures + imports)
│ └── public/index.html # Chat UI with mermaid rendering
├── package.json
└── README.md例子
"How does order creation work?"
"What happens when a user clicks checkout?"
"Trace the payment flow from frontend to backend"
"How does the cart sync between Shopify and our backend?"
"What services are involved in the refund flow?"
"Show me how authentication works across repos"