MCP Server LogoMCP Server
MCPsカテゴリディレクトリ投稿する
投稿する
MCPsカテゴリディレクトリ投稿する
投稿する

MCPサーバー

MCPサーバーのリスト、Awesome MCPサーバーとClaude MCP統合を含む。AIの能力を強化するためのMCPサーバーを検索して発見します。

お問い合わせ

[email protected]

MCPサーバーについて

プライバシーポリシー利用規約

リソース

モデルコンテキストプロトコルMCPスターターガイドClaude MCPサーバー

コミュニティ

GitHub

© 2025 mcpserver.cc © 2025 MCPサーバー. 全著作権所有.

プライバシーポリシー利用規約
  1. Home
  2. /Categories
  3. /Developer Tools
  4. /Unified Diff Mcp
Unified Diff Mcp

Unified Diff Mcp

作成者 gorosun•11 days ago
サイトを訪問する

Developer Tools
diff-visualizationgithub-integrationcode-comparison

Unified Diff MCP Server

Beautiful diff visualization for Claude Desktop. Transform code diffs into stunning visual comparisons with GitHub Gist integration and local file output.

Unified Diff Visualization Screenshot

✨ Features

  • 🎨 Beautiful HTML diff visualization using diff2html
  • 🌐 GitHub Gist integration for instant sharing
  • 📁 Local file output (PNG/HTML)
  • 🔄 Auto-delete functionality for temporary diffs
  • 🖥️ Cross-platform support (Windows, macOS, Linux)
  • ⚡ High-performance with Bun runtime
  • 🛡️ Enhanced Security with multi-level protection for shared diffs
  • 🔒 Multi-level security (Low/Medium/High) for different use cases

🚀 Quick Start

Installing via Smithery

bunx @smithery/cli install @gorosun/unified-diff-mcp --client claude --config '{
  "defaultAutoOpen": true,
  "defaultOutputMode": "html",
  "githubUsername": "your_actual_github_username",
  "githubToken": "ghp_your_actual_token_here"
}'

Manual Installation

  1. Install Claude Desktop and Bun
  2. Clone and build:
    git clone https://github.com/gorosun/unified-diff-mcp.git
    cd unified-diff-mcp
    bun install
    
  3. Configure Claude Desktop - see Configuration below

🛠️ Tools Overview

Tool Purpose Output Best For
visualize_diff_html_content Browser display & sharing GitHub Gist + HTML preview URL Quick sharing, instant viewing
visualize_diff_output_file Local file storage PNG/HTML files Local storage, presentations

📖 Usage Examples

🎯 Optimal Prompts by Purpose

Purpose Recommended Prompt Tool Used Output
Quick Preview Please visualize and preview the following diff:
以下のdiffを可視化してプレビューしてください
visualize_diff_html_content GitHub Gist + HTML preview URL
Local Storage Please visualize and save the following diff to a file:
以下のdiffを可視化してファイルに保存してください
visualize_diff_output_file Local HTML/PNG file
Share with Others Please visualize the following diff and create a shareable link:
以下のdiffを可視化して共有リンクを作成してください
visualize_diff_html_content GitHub Gist with shareable URL
Image Export Please visualize and save the following diff as a PNG image:
以下のdiffを可視化してPNG画像で保存してください
visualize_diff_output_file Local PNG image
Code Review Please visualize the following diff in side-by-side format:
以下のdiffをside-by-side形式で可視化してください
Either tool Side-by-side comparison
Documentation Please visualize and save the following diff as an HTML file:
以下のdiffを可視化してHTMLファイルで保存してください
visualize_diff_output_file Local HTML file
🔒 Secure Sharing Please visualize this diff with high security:
以下のdiffを高セキュリティで可視化してください
visualize_diff_html_content Secret Gist with auto-delete

Share diff instantly (GitHub Gist)

visualize_diff_html_content:
- Creates temporary GitHub Gist
- Auto-deletes after 30 minutes
- Instant browser-ready URLs
- Perfect for code reviews

Save diff locally

visualize_diff_output_file:
- Saves PNG or HTML to local disk
- Auto-opens in browser (optional)
- Perfect for documentation

🎛️ Configuration

Environment Variables

Variable Description Default
GITHUB_TOKEN GitHub Personal Access Token (for Gist integration) Required for visualize_diff_html_content
DEFAULT_AUTO_OPEN Auto-open generated files false
DEFAULT_OUTPUT_MODE Default output format (html or image) html

GitHub Token Setup

  1. Go to GitHub Settings > Personal Access Tokens
  2. Generate new token with gist scope
  3. Add to your environment:
    export GITHUB_TOKEN="your_token_here"
    

Claude Desktop Configuration

macOS:

code ~/Library/Application\ Support/Claude/claude_desktop_config.json

Windows:

code %APPDATA%\Claude\claude_desktop_config.json

Configuration template:

{
  "mcpServers": {
    "unified-diff-mcp": {
      "command": "bun",
      "args": ["run", "/path/to/unified-diff-mcp/src/index.ts"],
      "env": {
        "GITHUB_TOKEN": "your_github_token_here",
        "DEFAULT_AUTO_OPEN": "true",
        "DEFAULT_OUTPUT_MODE": "html"
      }
    }
  }
}

📋 Parameters Reference

Common Parameters

Parameter Type Default Description
diff string (required) Unified diff text
format string side-by-side Display format (line-by-line or side-by-side)
showFileList boolean true Show file list summary
highlight boolean true Enable syntax highlighting
oldPath string file.txt Original file path
newPath string file.txt Modified file path
autoOpen boolean false Auto-open in browser

GitHub Gist Specific

Parameter Type Default Description
expiryMinutes number 30 Auto-delete time (1-1440 minutes)
public boolean false Public vs secret gist

Local File Specific

Parameter Type Default Description
outputType string html Output format (html or image)

🌍 Platform Support

Platform Auto-Open Commands
Windows ✅ start (primary), explorer (fallback)
macOS ✅ open (primary), AppleScript (fallback)
Linux ✅ xdg-open

🔧 Development

Development mode (with hot reload):

{
  "command": "bun",
  "args": ["--watch", "/path/to/unified-diff-mcp/src/index.ts"]
}

Production mode:

{
  "command": "bun",
  "args": ["run", "/path/to/unified-diff-mcp/src/index.ts"]
}

📚 Advanced Usage

🔒 Enhanced Security Levels

When GitHub Token isn’t available or for secure sharing, you can choose from multiple security levels:

Security Level Configuration Features Use Cases
🟢 Low Secret Gist + 60min auto-delete URL-only access Code examples, learning
🟡 Medium Secret Gist + Password + 30min auto-delete URL + Access code required Team reviews
🔴 High Secret Gist + Password + 15min auto-delete URL + Access code + Short duration Sensitive code

Usage Example

Please visualize this diff with high security:
--- a/config.js
+++ b/config.js
@@ -1,3 +1,4 @@
 const config = {
-  apiKey: 'old-key'
+  apiKey: 'new-secure-key',
+  timeout: 5000
 };

Response Example:

🔒 **Secure Diff Visualization**

🔴 **Security Level**: High Security - Secret Gist + Password (15min auto-delete)
📋 **Preview Link**: https://htmlpreview.github.io/?...
🔑 **Access Code**: `a7x9k2`
⏰ **Auto-delete**: 15 minutes

🔄 Fallback Functionality

When GitHub Token is unavailable, the system falls back to local files:

  • HTML saved as temporary file
  • Automatic browser opening
  • Security-based file management

For detailed setup and integration guides:

  • 🇺🇸 English: CLAUDE_CODE_INTEGRATION.md{:target=“_blank”}
  • 🇯🇵 日本語: CLAUDE_CODE_INTEGRATION_JP.md{:target=“_blank”}

🤝 Supported Clients

  • Claude Desktop (Primary)
  • Claude Code (CLI)
  • VS Code + MCP Extension
  • Cline and other MCP clients

📄 License

MIT License - see LICENSE{:target=“_blank”} file for details.

Dependencies

Library License Purpose
diff2html MIT HTML diff generation
playwright-core Apache 2.0 Browser automation
@modelcontextprotocol/sdk MIT MCP integration

Made with ❤️ for the Claude Desktop community

前提条件

  • •サーバーのドメインに精通している
  • •関連技術の基本的な理解
  • •Developer Toolsの知識

おすすめのサーバー

Mcp

Mcp

The registry mcp server updates your resume while you code

Mcp Minecraft

Mcp Minecraft

Mcpnotes

Mcpnotes

A simple note-taking MCP server for recording and managing notes with AI models.

もっと見る → →

詳細

作成日

June 11, 2025

最終更新日

June 11, 2025

カテゴリー

Developer Tools

作成者

gorosun

シェアする

もっと見る

Python_mcp

Python_mcp

MCP Server to run python code locally

Datagov Mcp Server

Datagov Mcp Server

An MCP server for accessing data from Data.gov, providing tools and resources for interacting with government datasets.

Server Wp Mcp

Server Wp Mcp

Mcp Pubmed Server

Mcp Pubmed Server

PubMed MCP Server for accessing research papers