ExpoSnap MCP Server

A Model Context Protocol (MCP) server that enables AI assistants to view and analyze screenshots from React Native/Expo applications. Seamlessly integrates with Claude, Cursor, VS Code, and other MCP-compatible editors for AI-powered mobile UI development.

Setup

1. Add MCP server to your IDE

Claude Code

claude mcp add exposnap -- npx -y exposnap

Cursor

Add to .cursor/mcp.json:

{
  "mcpServers": {
    "exposnap": {
      "command": "npx",
      "args": ["-y", "exposnap"]
    }
  }
}

VS Code

Add to .vscode/mcp.json:

{
  "servers": {
    "exposnap": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "exposnap"]
    }
  }
}

Claude Desktop

Settings → Developer → Edit Config:

{
  "mcpServers": {
    "exposnap": {
      "command": "npx",
      "args": ["-y", "exposnap"]
    }
  }
}

2. Add to your Expo app

npm install exposnap

3. Configure your React Native app

import { ScreenshotWrapper } from 'exposnap';

export default function App() {
  return (
    <ScreenshotWrapper>
      <YourApp />
    </ScreenshotWrapper>
  );
}

The wrapper automatically discovers your MCP server and provides a draggable camera icon for manual screenshot capture.

Contributing

We welcome contributions! See CONTRIBUTING.md for details.

License

MIT - see LICENSE for details.