This document provides a comprehensive overview of configuring and utilizing the Eraser.io Model Context Protocol (MCP) server across various AI clients. Integrating Eraser via MCP transforms your static system architecture diagrams and markdown files from standard developer documentation into active context for your AI workflows.
1. Architectural Overview: How Eraser MCP Works
The Model Context Protocol (MCP) is an open standard designed to securely bridge the gap between LLMs (Large Language Models) and external data sources. Instead of forcing developers to constantly copy-paste snippets or feed heavy text files into context windows, Eraser acts as an MCP Host/Server.
┌─────────────────┐ MCP Request ┌───────────────────┐
│ AI Client / │ ────────────────────────> │ Eraser MCP Server │
│ Coding Agent │ <──────────────────────── │ (app.eraser.io) │
└─────────────────┘ Context JSON └───────────────────┘
│ │
▼ ▼
Reads Local Codebase Fetches Architecture,
& Project Files Flowcharts & Tech Docs
When connected, your AI assistant can run native tools exposed by Eraser to programmatically query, read, and understand systemic engineering logic, creating an environment where code generation aligns perfectly with pre-defined architecture boundaries.
The Problem of Context Rot
Traditional engineering workflows suffer from documentation decay. Developers update code, but visual diagrams in external tools become outdated. By exposing live canvas objects as machine-readable state via an MCP server, your AI assistants gain visibility into:
- Current boundary definitions and microservice scopes.
- Up-to-date data schemas and entity relationships.
- Active security rules, encryption boundaries, and compliance mandates.
2. Configuration Settings Breakdown
Based on the interface shown below, the core connection engine relies on a standardized HTTP transport protocol. Below is the primary endpoint layer used across integrations:
- MCP Settings Path: Accessible via Personal Settings → MCP in the Eraser dashboard.
-
Base Connection URL:
https://app.eraser.io/api/mcp - Transport Mechanism: HTTP
- Authentication Mechanism: Managed via Bearer tokens generated natively by the specific integration flow, or through the API Tokens tab under Team Settings.
3. Client-Specific Integration Playbook
Eraser natively exposes integration vectors for six core AI developer tools. Here is how to configure and utilize each interface.
1. Claude Code (Anthropic's Agentic CLI)
Claude Code executes directly within your terminal, acting as an interactive engineering agent capable of executing local commands, managing state, and writing software.
Setup Implementation: Run the following command directly in your project terminal:
claude mcp add --transport http eraser https://app.eraser.io/api/mcp
Operational Capability: Once initialized, Claude Code queries the endpoint on demand. If you ask it to build a new microservice route, it checks your active canvas first to preserve compliance, isolation, and formatting criteria.
Primary Use Case: Agentic terminal operations where the model creates files, runs build scripts, and refactors large directory structures while referencing systemic documentation.
2. Claude.ai (Web Interface)
For high-level system architectural debates, product feature scoping, and design review processes conducted outside the terminal environment.
Setup Implementation: Select the Claude.ai client block in Eraser and follow the OAuth authorization prompt to allow the official connector access to your workspace.
Operational Capability: Allows you to query the web model directly using conversational requests like: "Review this database schema from my Eraser workspace against our tenant isolation policy."
Primary Use Case: Early-stage planning, architectural decision records (ADRs), and non-developer technical strategy reviews.
3. OpenAI Codex
Ideal for legacy orchestration setups and developers using custom workflows built around OpenAI's foundational code models.
Setup Implementation: Point your environment's manual MCP JSON configuration block to target the Eraser API transport layer using your secure API token header.
Operational Capability: Supplies raw code completion setups with explicit definitions of complex dependencies, network edges, and microservice topologies.
Primary Use Case: Automated CI/CD pipeline script generation and custom internal AI tooling configurations.
4. VS Code (Visual Studio Code)
Integrates deep architectural context inside the industry's standard code editor.
Setup Implementation: Configured via the workspace or global settings file. You append the Eraser server path directly into the JSON configuration under the server list.
Operational Capability: Empowers inline chat mechanisms, prompt sidebars, and local inline edits to respect data flow diagrams and existing module logic.
Primary Use Case: Day-to-day feature development where developers need immediate, inline feedback based on established architectural patterns.
5. Cursor
Cursor is designed from the ground up for deep indexing of local repositories. By pairing it with Eraser, it indexes the architectural mapping alongside the codebase.
Setup Implementation: Navigate to Cursor Settings → Features → MCP. Click Add New MCP Server, choose http as the type, and input https://app.eraser.io/api/mcp along with your validation token.
Operational Capability: Enables deep contextual symbol lookups and multi-file editing that respects visual boundaries, sequence diagrams, and module interactions.
Primary Use Case: Complex code generation tasks spanning multiple files and services where strict architectural adherence is required.
6. GitHub Copilot
Brings systemic awareness to the default AI pair-programmer natively integrated into the GitHub ecosystem.
Setup Implementation: Configured via the Copilot Chat extensions hub or custom JSON manifests inside enterprise development environments using the HTTP endpoint.
Operational Capability: Cuts down on generic boilerplate code suggestions by forcing Copilot's autocompletion logic to operate within the specific guidelines defined inside your team's technical documentation.
Primary Use Case: Auto-completing daily function bodies and boilerplate with exact type definitions and error-handling routines specified in project documents.
4. Operational Comparison Matrix
| AI Client | Interface | Primary Connection Method | Key Architectural Benefit |
|---|---|---|---|
| Claude Code | Terminal CLI |
claude mcp add CLI command |
Full agentic filesystem access guided by system design. |
| Claude.ai | Web UI | Direct OAuth / Connector | High-level system design debates and ADR formulation. |
| OpenAI Codex | Custom / API | Endpoint Configuration JSON | Automated pipeline tooling and script generation. |
| VS Code | IDE | Extension / JSON Settings | Direct IDE context for standard development loops. |
| Cursor | Native AI IDE | MCP Settings UI Panel | Multi-file generation adhering to visual flowcharts. |
| GitHub Copilot | IDE Plugin | Copilot Extension Manifest | In-line completions aligned with documented schema specs. |
5. Engineering Best Practices for MCP-First Documentation
To get the most out of Eraser's MCP server, documentation should be structured with the AI's perspective in mind:
- Keep Text and Diagrams Together: Eraser allows anchoring raw Markdown notes directly beneath a visual diagram. Use this to describe architectural decisions, edge cases, or security parameters that a diagram alone cannot convey.
- Establish a Single Source of Truth: Replace disconnected external files with active workspace canvases. Keep the architecture dynamic and centralized so the AI model never pulls from an outdated specification.
- Semantic Naming Conventions: Give clear, explicit names to your files, objects, and modules (for example, Level 1 – System Overview or Authentication Flow). Clean naming conventions make it easier for the AI to locate, parse, and inject context during code generation.
- Define Clear Boundaries in Markdown: Annotate diagrams with clear text headings specifying module boundaries, supported protocol versions, database constraints, and network ports. AI models read these explicit directives to generate accurate API signatures.
Top comments (0)