react-analyzer-mcp
2025.04.10
6
TypeScriptReact 代码分析文档生成开发效率
react-analyzer-mcp 是一个基于 Model Context Protocol 的工具，用于分析和生成 React 代码的文档。它能够分析 React 组件文件（JSX/TSX）并提取组件及其属性的信息。该工具适用于开发者在项目中进行 React 组件的文档生成和分析。
View on GitHub
Overview
基本能力
产品定位
react-analyzer-mcp 是一个用于分析和生成 React 代码文档的工具，帮助开发者更好地理解和维护 React 项目。
核心功能
- 分析单个 React 组件的源代码。
- 生成项目文件夹中所有 React 组件的文档。
- 列出根文件夹下的所有项目。
适用场景
- 需要快速生成 React 组件文档的项目。
- 需要分析和理解现有 React 组件结构的开发者。
- 需要自动化文档生成的团队。
工具列表
- analyze-react: 分析单个 React 组件的源代码。
- analyze-project: 生成项目文件夹中所有 React 组件的文档。
- list-projects: 列出根文件夹下的所有项目。
常见问题解答
无明确常见问题解答内容。
使用教程
使用依赖
确保已安装 Node.js 和 npm。
安装教程
# 克隆仓库
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 Desktop 配置中启用 MCP 服务器：
{
"react-analyzer-mcp": {
"command": "node",
"args": [
"/Users/azer/code/sandbox/react-analyzer-mcp/build/index.js"
]
}
}
- 使用 Claude Shell 连接到 MCP 服务器。
- 在 Claude 对话中直接使用工具：
Analyze my project's React components in the "ui" folder.
或：
What React components do I have in my project?