react-analyzer-mcp
使用模型上下文协议 (Model Context Protocol) 分析并生成 React 代码文档。基于react-analyzer库。
它的作用
该工具分析 React 组件文件（JSX/TSX）并提取有关组件及其 props 的信息。
Related MCP server: Project Explorer MCP Server
可用工具
analyze-react ：从源代码分析单个 React 组件
analyze-project ：为项目文件夹中的所有 React 组件生成文档
list-projects ：列出根文件夹下的所有项目
安装
# Clone the repository
git clone https://github.com/azer/react-analyzer-mcp.git
cd react-analyzer-mcp
# Install dependencies
npm install
# Update PROJECT_ROOT in the index.ts file.
vim src/index.ts
# Build
npm run build
与 Claude 一起使用
在 Claude Desktop 配置中启用 MCP 服务器：
{
"react-analyzer-mcp": {
"command": "node",
"args": [
"/Users/azer/code/sandbox/react-analyzer-mcp/build/index.js"
]
}
}
使用 Claude Shell 将 Claude 连接到您的 MCP 服务器。
在 Claude 对话中直接使用这些工具：
Analyze my project's React components in the "ui" folder.
或者：
What React components do I have in my project?
示例
分析项目文件夹：
输入：
Can you analyze the components in my "foobar" folder?
输出：
# Components
## Button
### Props
| Prop | Type | Optional | Default |
|------|------|----------|---------|
| `variant` | `string` | ✓ | `primary` |
| `size` | `string` | ✓ | `md` |
| `onClick` | `function` | ✓ | |
...
执照
麻省理工学院