mirror of https://github.com/facebook/react.git synced 2026-02-24 20:53:03 +00:00

Files

Jorge Cabiedes 2b4064eb9b [mcp] Add MCP tool to print out the component tree of the currently open React App (#33305 )

## Summary

This tool leverages DevTools to get the component tree from the
currently open React App. This gives realtime information to agents
about the state of the app.

## How did you test this change?

Tested integration with Claude Desktop

2025-06-02 21:42:34 -07:00

src

[mcp] Add MCP tool to print out the component tree of the currently open React App (#33305 )

2025-06-02 21:42:34 -07:00

package.json

[mcp] Fix package.json (#33101 )

2025-05-02 13:56:01 -04:00

README.md

[compiler] Init react-mcp-server (#32859 )

2025-04-14 18:39:00 -04:00

todo.md

[compiler] Init react-mcp-server (#32859 )

2025-04-14 18:39:00 -04:00

tsconfig.json

[compiler] Init react-mcp-server (#32859 )

2025-04-14 18:39:00 -04:00

tsup.config.ts

[compiler] Add missing copyrights (#33004 )

2025-04-23 22:04:44 -04:00

README.md

React MCP Server (experimental)

An experimental MCP Server for React.

Development

First, add this file if you're using Claude Desktop: code ~/Library/Application\ Support/Claude/claude_desktop_config.json. Copy the absolute path from which node and from react/compiler/react-mcp-server/dist/index.js and paste, for example:

{
  "mcpServers": {
    "react": {
      "command": "/Users/<username>/.asdf/shims/node",
      "args": [
        "/Users/<username>/code/react/compiler/packages/react-mcp-server/dist/index.js"
      ]
    }
  }
}

Next, run yarn workspace react-mcp-server watch from the react/compiler directory and make changes as needed. You will need to restart Claude everytime you want to try your changes.