mcp-integration

97
3
Source

This skill should be used when the user asks to "add MCP server", "integrate MCP", "configure MCP in plugin", "use .mcp.json", "set up Model Context Protocol", "connect external service", mentions "${CLAUDE_PLUGIN_ROOT} with MCP", or discusses MCP server types (SSE, stdio, HTTP, WebSocket). Provides comprehensive guidance for integrating Model Context Protocol servers into Claude Code plugins for external tool and service integration.

Install

mkdir -p .claude/skills/mcp-integration && curl -L -o skill.zip "https://mcp.directory/api/skills/download/34" && unzip -o skill.zip -d .claude/skills/mcp-integration && rm skill.zip

Installs to .claude/skills/mcp-integration

About this skill

MCP Integration for Claude Code Plugins

Overview

Model Context Protocol (MCP) enables Claude Code plugins to integrate with external services and APIs by providing structured tool access. Use MCP integration to expose external service capabilities as tools within Claude Code.

Key capabilities:

  • Connect to external services (databases, APIs, file systems)
  • Provide 10+ related tools from a single service
  • Handle OAuth and complex authentication flows
  • Bundle MCP servers with plugins for automatic setup

MCP Server Configuration Methods

Plugins can bundle MCP servers in two ways:

Method 1: Dedicated .mcp.json (Recommended)

Create .mcp.json at plugin root:

{
  "database-tools": {
    "command": "${CLAUDE_PLUGIN_ROOT}/servers/db-server",
    "args": ["--config", "${CLAUDE_PLUGIN_ROOT}/config.json"],
    "env": {
      "DB_URL": "${DB_URL}"
    }
  }
}

Benefits:

  • Clear separation of concerns
  • Easier to maintain
  • Better for multiple servers

Method 2: Inline in plugin.json

Add mcpServers field to plugin.json:

{
  "name": "my-plugin",
  "version": "1.0.0",
  "mcpServers": {
    "plugin-api": {
      "command": "${CLAUDE_PLUGIN_ROOT}/servers/api-server",
      "args": ["--port", "8080"]
    }
  }
}

Benefits:

  • Single configuration file
  • Good for simple single-server plugins

MCP Server Types

stdio (Local Process)

Execute local MCP servers as child processes. Best for local tools and custom servers.

Configuration:

{
  "filesystem": {
    "command": "npx",
    "args": ["-y", "@modelcontextprotocol/server-filesystem", "/allowed/path"],
    "env": {
      "LOG_LEVEL": "debug"
    }
  }
}

Use cases:

  • File system access
  • Local database connections
  • Custom MCP servers
  • NPM-packaged MCP servers

Process management:

  • Claude Code spawns and manages the process
  • Communicates via stdin/stdout
  • Terminates when Claude Code exits

SSE (Server-Sent Events)

Connect to hosted MCP servers with OAuth support. Best for cloud services.

Configuration:

{
  "asana": {
    "type": "sse",
    "url": "https://mcp.asana.com/sse"
  }
}

Use cases:

  • Official hosted MCP servers (Asana, GitHub, etc.)
  • Cloud services with MCP endpoints
  • OAuth-based authentication
  • No local installation needed

Authentication:

  • OAuth flows handled automatically
  • User prompted on first use
  • Tokens managed by Claude Code

HTTP (REST API)

Connect to RESTful MCP servers with token authentication.

Configuration:

{
  "api-service": {
    "type": "http",
    "url": "https://api.example.com/mcp",
    "headers": {
      "Authorization": "Bearer ${API_TOKEN}",
      "X-Custom-Header": "value"
    }
  }
}

Use cases:

  • REST API-based MCP servers
  • Token-based authentication
  • Custom API backends
  • Stateless interactions

WebSocket (Real-time)

Connect to WebSocket MCP servers for real-time bidirectional communication.

Configuration:

{
  "realtime-service": {
    "type": "ws",
    "url": "wss://mcp.example.com/ws",
    "headers": {
      "Authorization": "Bearer ${TOKEN}"
    }
  }
}

Use cases:

  • Real-time data streaming
  • Persistent connections
  • Push notifications from server
  • Low-latency requirements

Environment Variable Expansion

All MCP configurations support environment variable substitution:

${CLAUDE_PLUGIN_ROOT} - Plugin directory (always use for portability):

{
  "command": "${CLAUDE_PLUGIN_ROOT}/servers/my-server"
}

User environment variables - From user's shell:

{
  "env": {
    "API_KEY": "${MY_API_KEY}",
    "DATABASE_URL": "${DB_URL}"
  }
}

Best practice: Document all required environment variables in plugin README.

MCP Tool Naming

When MCP servers provide tools, they're automatically prefixed:

Format: mcp__plugin_<plugin-name>_<server-name>__<tool-name>

Example:

  • Plugin: asana
  • Server: asana
  • Tool: create_task
  • Full name: mcp__plugin_asana_asana__asana_create_task

Using MCP Tools in Commands

Pre-allow specific MCP tools in command frontmatter:

---
allowed-tools: [
  "mcp__plugin_asana_asana__asana_create_task",
  "mcp__plugin_asana_asana__asana_search_tasks"
]
---

Wildcard (use sparingly):

---
allowed-tools: ["mcp__plugin_asana_asana__*"]
---

Best practice: Pre-allow specific tools, not wildcards, for security.

Lifecycle Management

Automatic startup:

  • MCP servers start when plugin enables
  • Connection established before first tool use
  • Restart required for configuration changes

Lifecycle:

  1. Plugin loads
  2. MCP configuration parsed
  3. Server process started (stdio) or connection established (SSE/HTTP/WS)
  4. Tools discovered and registered
  5. Tools available as mcp__plugin_...__...

Viewing servers: Use /mcp command to see all servers including plugin-provided ones.

Authentication Patterns

OAuth (SSE/HTTP)

OAuth handled automatically by Claude Code:

{
  "type": "sse",
  "url": "https://mcp.example.com/sse"
}

User authenticates in browser on first use. No additional configuration needed.

Token-Based (Headers)

Static or environment variable tokens:

{
  "type": "http",
  "url": "https://api.example.com",
  "headers": {
    "Authorization": "Bearer ${API_TOKEN}"
  }
}

Document required environment variables in README.

Environment Variables (stdio)

Pass configuration to MCP server:

{
  "command": "python",
  "args": ["-m", "my_mcp_server"],
  "env": {
    "DATABASE_URL": "${DB_URL}",
    "API_KEY": "${API_KEY}",
    "LOG_LEVEL": "info"
  }
}

Integration Patterns

Pattern 1: Simple Tool Wrapper

Commands use MCP tools with user interaction:

# Command: create-item.md
---
allowed-tools: ["mcp__plugin_name_server__create_item"]
---

Steps:
1. Gather item details from user
2. Use mcp__plugin_name_server__create_item
3. Confirm creation

Use for: Adding validation or preprocessing before MCP calls.

Pattern 2: Autonomous Agent

Agents use MCP tools autonomously:

# Agent: data-analyzer.md

Analysis Process:
1. Query data via mcp__plugin_db_server__query
2. Process and analyze results
3. Generate insights report

Use for: Multi-step MCP workflows without user interaction.

Pattern 3: Multi-Server Plugin

Integrate multiple MCP servers:

{
  "github": {
    "type": "sse",
    "url": "https://mcp.github.com/sse"
  },
  "jira": {
    "type": "sse",
    "url": "https://mcp.jira.com/sse"
  }
}

Use for: Workflows spanning multiple services.

Security Best Practices

Use HTTPS/WSS

Always use secure connections:

✅ "url": "https://mcp.example.com/sse"
❌ "url": "http://mcp.example.com/sse"

Token Management

DO:

  • ✅ Use environment variables for tokens
  • ✅ Document required env vars in README
  • ✅ Let OAuth flow handle authentication

DON'T:

  • ❌ Hardcode tokens in configuration
  • ❌ Commit tokens to git
  • ❌ Share tokens in documentation

Permission Scoping

Pre-allow only necessary MCP tools:

✅ allowed-tools: [
  "mcp__plugin_api_server__read_data",
  "mcp__plugin_api_server__create_item"
]

❌ allowed-tools: ["mcp__plugin_api_server__*"]

Error Handling

Connection Failures

Handle MCP server unavailability:

  • Provide fallback behavior in commands
  • Inform user of connection issues
  • Check server URL and configuration

Tool Call Errors

Handle failed MCP operations:

  • Validate inputs before calling MCP tools
  • Provide clear error messages
  • Check rate limiting and quotas

Configuration Errors

Validate MCP configuration:

  • Test server connectivity during development
  • Validate JSON syntax
  • Check required environment variables

Performance Considerations

Lazy Loading

MCP servers connect on-demand:

  • Not all servers connect at startup
  • First tool use triggers connection
  • Connection pooling managed automatically

Batching

Batch similar requests when possible:

# Good: Single query with filters
tasks = search_tasks(project="X", assignee="me", limit=50)

# Avoid: Many individual queries
for id in task_ids:
    task = get_task(id)

Testing MCP Integration

Local Testing

  1. Configure MCP server in .mcp.json
  2. Install plugin locally (.claude-plugin/)
  3. Run /mcp to verify server appears
  4. Test tool calls in commands
  5. Check claude --debug logs for connection issues

Validation Checklist

  • MCP configuration is valid JSON
  • Server URL is correct and accessible
  • Required environment variables documented
  • Tools appear in /mcp output
  • Authentication works (OAuth or tokens)
  • Tool calls succeed from commands
  • Error cases handled gracefully

Debugging

Enable Debug Logging

claude --debug

Look for:

  • MCP server connection attempts
  • Tool discovery logs
  • Authentication flows
  • Tool call errors

Common Issues

Server not connecting:

  • Check URL is correct
  • Verify server is running (stdio)
  • Check network connectivity
  • Review authentication configuration

Tools not available:

  • Verify server connected successfully
  • Check tool names match exactly
  • Run /mcp to see available tools
  • Restart Claude Code after config changes

Authentication failing:

  • Clear cached auth tokens
  • Re-authenticate
  • Check token scopes and permissions
  • Verify environment variables set

Quick Reference

MCP Server Types

TypeTransportBest ForAuth
stdioProcessLocal tools, custom serversEnv vars
SSEHTTPHosted services, cloud APIsOAuth
HTTPRESTAPI backends, token authTokens
wsWebSocketReal-time, streamingTokens

Configuration Checklist

  • Server type specified (stdio/SSE/HTTP/ws)
  • Type-specific fields complete (command or url)
  • Authentication configured
  • Environment variables documented
  • HTTPS/WSS used (not HTTP/WS)
  • ${CLAUDE_PLUGIN_ROOT} used for paths

Best Practices

DO:

  • ✅ Use ${CLAUDE_PLUGIN_ROOT} for portable paths
  • ✅ Document required environment variables
  • ✅ Use secure connections (HTTPS/WSS)
  • ✅ Pre-allow specific MCP tools in commands
  • ✅ Test MCP integration before publishing
  • ✅ Handle connection and tool errors gracefully

DON'T:

  • ❌ Hardcode absolute paths
  • ❌ Commit credentials to git
  • ❌ Use HTTP instead of HTTPS
  • ❌ Pre-allow all tools with wildcards
  • ❌ Skip error handling
  • ❌ Forget to document setup

Additional Resources

Reference Files

For detailed information, consult:

  • references/server-types.md - Deep dive on each server type
  • references/authentication.md - Authentication patterns and OAuth
  • references/tool-usage.md - Using MCP tools in commands and agents

Example Configurations

Working examples in examples/:

  • stdio-server.json - Local stdio MCP server
  • sse-server.json - Hosted SSE server with OAuth
  • http-server.json - REST API with token auth

External Resources

Implementation Workflow

To add MCP integration to a plugin:

  1. Choose MCP server type (stdio, SSE, HTTP, ws)
  2. Create .mcp.json at plugin root with configuration
  3. Use ${CLAUDE_PLUGIN_ROOT} for all file references
  4. Document required environment variables in README
  5. Test locally with /mcp command
  6. Pre-allow MCP tools in relevant commands
  7. Handle authentication (OAuth or tokens)
  8. Test error cases (connection failures, auth errors)
  9. Document MCP integration in plugin README

Focus on stdio for custom/local servers, SSE for hosted services with OAuth.

More by anthropics

View all →

frontend-design

anthropics

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

12382

mcp-builder

anthropics

Guide for creating high-quality MCP (Model Context Protocol) servers that enable LLMs to interact with external services through well-designed tools. Use when building MCP servers to integrate external APIs or services, whether in Python (FastMCP) or Node/TypeScript (MCP SDK).

12843

skill-creator

anthropics

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations.

12126

webapp-testing

anthropics

Toolkit for interacting with and testing local web applications using Playwright. Supports verifying frontend functionality, debugging UI behavior, capturing browser screenshots, and viewing browser logs.

11320

xlsx

anthropics

Comprehensive spreadsheet creation, editing, and analysis with support for formulas, formatting, data analysis, and visualization. When Claude needs to work with spreadsheets (.xlsx, .xlsm, .csv, .tsv, etc) for: (1) Creating new spreadsheets with formulas and formatting, (2) Reading or analyzing data, (3) Modify existing spreadsheets while preserving formulas, (4) Data analysis and visualization in spreadsheets, or (5) Recalculating formulas

10216

pptx

anthropics

Presentation creation, editing, and analysis. When Claude needs to work with presentations (.pptx files) for: (1) Creating new presentations, (2) Modifying or editing content, (3) Working with layouts, (4) Adding comments or speaker notes, or any other presentation tasks

12915

You might also like

flutter-development

aj-geddes

Build beautiful cross-platform mobile apps with Flutter and Dart. Covers widgets, state management with Provider/BLoC, navigation, API integration, and material design.

287790

drawio-diagrams-enhanced

jgtolentino

Create professional draw.io (diagrams.net) diagrams in XML format (.drawio files) with integrated PMP/PMBOK methodologies, extensive visual asset libraries, and industry-standard professional templates. Use this skill when users ask to create flowcharts, swimlane diagrams, cross-functional flowcharts, org charts, network diagrams, UML diagrams, BPMN, project management diagrams (WBS, Gantt, PERT, RACI), risk matrices, stakeholder maps, or any other visual diagram in draw.io format. This skill includes access to custom shape libraries for icons, clipart, and professional symbols.

213415

godot

bfollington

This skill should be used when working on Godot Engine projects. It provides specialized knowledge of Godot's file formats (.gd, .tscn, .tres), architecture patterns (component-based, signal-driven, resource-based), common pitfalls, validation tools, code templates, and CLI workflows. The `godot` command is available for running the game, validating scripts, importing resources, and exporting builds. Use this skill for tasks involving Godot game development, debugging scene/resource files, implementing game systems, or creating new Godot components.

213295

nano-banana-pro

garg-aayush

Generate and edit images using Google's Nano Banana Pro (Gemini 3 Pro Image) API. Use when the user asks to generate, create, edit, modify, change, alter, or update images. Also use when user references an existing image file and asks to modify it in any way (e.g., "modify this image", "change the background", "replace X with Y"). Supports both text-to-image generation and image-to-image editing with configurable resolution (1K default, 2K, or 4K for high resolution). DO NOT read the image file first - use this skill directly with the --input-image parameter.

219234

ui-ux-pro-max

nextlevelbuilder

"UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient."

171200

rust-coding-skill

UtakataKyosui

Guides Claude in writing idiomatic, efficient, well-structured Rust code using proper data modeling, traits, impl organization, macros, and build-speed best practices.

166173

Stay ahead of the MCP ecosystem

Get weekly updates on new skills and servers.