# Claude Desktop Integration Guide
## 🔗 Connecting the Debugger MCP Server to Claude Desktop
### Step 1: Locate Claude Desktop Configuration
**macOS:**
```bash
~/Library/Application Support/Claude/claude_desktop_config.json
```
**Windows:**
```bash
%APPDATA%\Claude\claude_desktop_config.json
```
### Step 2: Add MCP Server Configuration
Add this to your `claude_desktop_config.json`:
```json
{
"mcpServers": {
"debugger-mcp": {
"command": "npm",
"args": ["run", "dev"],
"cwd": "/Users/randywilson/Desktop/to-build/debugger-mcp"
}
}
}
```
**Note:** Update the `cwd` path to match your actual project location.
### Step 3: Start the MCP Server
In your debugger-mcp directory:
```bash
npm run dev
```
### Step 4: Restart Claude Desktop
Close and reopen Claude Desktop to load the new MCP server configuration.
### Step 5: Test the Integration
In Claude Desktop, you should now be able to use commands like:
- "Analyze the complexity of my React component"
- "Show me current code quality violations"
- "Get the current debugging session status"
- "What performance issues do you detect?"
## 🧪 Testing Commands
Try these example prompts in Claude Desktop:
1. **"Use get-debug-session to show me the current debugging status"**
2. **"Use analyze-complexity on test-app/src/components/ProblematicComponent.tsx"**
3. **"Use get-violations to show me all code quality issues"**
4. **"Use get-performance to show current performance metrics"**
## 🔧 Troubleshooting
If the MCP server doesn't connect:
1. Check that the path in `cwd` is correct
2. Ensure `npm run dev` works in the terminal
3. Check Claude Desktop logs for connection errors
4. Restart Claude Desktop after configuration changes
