React Analyzer Mcp
MCP server 用于在本地分析和生成 React 代码的文档
概述
react-analyzer-mcp
基于模型上下文协议（Model Context Protocol）分析并生成React代码文档。构建于react-analyzer库。
功能
该工具可分析React组件文件（JSX/TSX），提取组件及其props的相关信息。
可用工具
- analyze-react: 从源代码分析单个React组件
- analyze-project: 为项目文件夹中的所有React组件生成文档
- list-projects: 列出根文件夹下的所有项目
安装
bash
# 克隆仓库
git clone https://github.com/azer/react-analyzer-mcp.git
cd react-analyzer-mcp
# 安装依赖
npm install
# 在index.ts文件中更新PROJECT_ROOT
vim src/index.ts
# 构建
npm run build与Claude配合使用
- 在Claude Desktop配置中启用MCP服务器：
bash
{
"react-analyzer-mcp": {
"command": "node",
"args": [
"/Users/azer/code/sandbox/react-analyzer-mcp/build/index.js"
]
}
}-
使用Claude Shell将Claude连接到您的MCP服务器。
-
直接在Claude对话中使用工具：
分析我项目"ui"文件夹中的React组件。或：
我的项目中有哪些React组件？示例
分析项目文件夹：
输入：
你能分析我"foobar"文件夹中的组件吗？输出：
# 组件
## Button
### Props
| 属性 | 类型 | 可选 | 默认值 |
|------|------|----------|---------|
| `variant` | `string` | ✓ | `primary` |
| `size` | `string` | ✓ | `md` |
| `onClick` | `function` | ✓ | |
...许可协议
MIT