react-analyzer-mcp

Analyze & generate docs for React code using the Model Context Protocol. Based on react-analyzer library.

What it does

This tool analyzes React component files (JSX/TSX) and extracts information about components and their props.

Available Tools

analyze-react: Analyzes a single React component from source code
analyze-project: Generates documentation for all React components in a project folder
list-projects: Lists all projects under the root folder

Installation

# 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

Using with Claude

Enable MCP server in the Claude Desktop config:

{
    "react-analyzer-mcp": {
      "command": "node",
      "args": [
        "/Users/azer/code/sandbox/react-analyzer-mcp/build/index.js"
      ]
    }
}

Connect Claude to your MCP server using the Claude Shell.
Use the tools directly in Claude conversations:

Analyze my project's React components in the "ui" folder.

Or:

What React components do I have in my project?

Examples

Analyzing a project folder:

Input:

Can you analyze the components in my "foobar" folder?

Output:

# Components

## Button

### Props

| Prop | Type | Optional | Default |
|------|------|----------|---------|
| `variant` | `string` | ✓ | `primary` |
| `size` | `string` | ✓ | `md` |
| `onClick` | `function` | ✓ | |
...

License

MIT

This server cannot be installed

security - not tested

license - not tested

quality - not tested

local-only server

The server can only run on the client's local machine because it depends on local resources.

analyze your react projects locally
consistent output w/ AST parsing + AI
create markdown docs, llm.txt for your react code at once

Related MCP Servers

Coding Standards MCP Server
ggerve
-
security
F
license
-
quality
Provides tools for accessing coding style guidelines and best practices for various technologies including Java, Python, and React.
Last updated -
Python
SourceSage MCP
Sunwood-ai-labs
A
security
F
license
A
quality
A TypeScript-based server that visualizes project directory structures in Markdown format, automatically documenting file contents with syntax highlighting and supporting customizable exclusion patterns.
Last updated -
1
3
2
TypeScript
Figma to React Native MCP
kailashAppDev
-
security
F
license
-
quality
Converts Figma designs to React Native components, allowing users to extract components from Figma designs and generate corresponding React Native components with proper typing and styling.
Last updated -
111
1
TypeScript
Ant Design Components MCP Server
hannesj
-
security
F
license
-
quality
Exposes Ant Design component documentation to Large Language Models, allowing LLMs to explore and understand Ant Design components through specialized tools for listing components, viewing documentation, inspecting props, and browsing code examples.
Last updated -
JavaScript

View all related MCP servers

react-analyzer-mcp

react-analyzer-mcp

What it does

Available Tools

Installation

Using with Claude

Examples

Analyzing a project folder:

License

Related MCP Servers

Coding Standards MCP Server

SourceSage MCP

Figma to React Native MCP

Ant Design Components MCP Server

New MCP Servers

MCP directory API