AI导哈

图像格式转换服务

基于Sharp的高性能图像格式转换服务，支持SVG到WebP/PNG/JPEG的转换，适用于Web优化和批量处理。

  • by Rixmerz
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 Rixmerz/image-converter-mcp

使用说明

图像转换器MCP服务器

用于网络优化图像格式转换的专业MCP（模型上下文协议）服务器。采用Sharp构建，用于高性能图像处理，专注于SVG→ WebP/PNG/JPEG转换。

特性

  • 🚀 高性能：基于Sharp（libvips）构建，用于快速图像处理
  • 🎨 SVG支持：具有缩放选项的专业SVG到光栅转换
  • 📦 批处理：在一次操作中转换多个图像
  • ⚙️ 质量预设：优化了具有自定义选项的web默认值
  • 🔍 影像元数据：无需转换即可获取详细信息
  • 🛡️ 类型安全：带有Zod验证的完整TypeScript

安装

npm install
npm run build

可用工具

1. convert_image -常规图像转换

将任何支持的图像转换为具有质量和尺寸选项的其他格式。

参数：

参数 类型 必填 默认 说明
inputPath string ✅ - 输入图像的绝对路径
outputFormat 枚举 ✅ - webp, png，或 jpeg
quality 编号 ❌ 80/85* 质量（1-100）*因格式而异
width 编号 ❌ - 目标宽度（保持纵横比）
height 编号 ❌ - 目标高度（保持纵横比）
outputPath string ❌ auto 输出路径（默认：相同目录，新文本）

例子：

{
  "inputPath": "/path/to/image.png",
  "outputFormat": "webp",
  "quality": 85,
  "width": 1920
}

答复：

{
  "success": true,
  "outputPath": "/path/to/image.webp",
  "metadata": {
    "format": "webp",
    "width": 1920,
    "height": 1080,
    "size": 125430,
    "originalSize": 450230,
    "compressionRatio": "72.1%"
  }
}

2. convert_svg -SVG到光栅转换

用于将SVG文件转换为具有缩放选项的光栅格式的专用工具。

参数：

参数 类型 必填 默认 说明
inputPath string ✅ - SVG文件的绝对路径
outputFormat 枚举 ✅ - webp, png，或 jpeg
quality 编号 ❌ 80 质量（1-100）
scale 编号 ❌ 1 比例因子（视网膜为1x、2x、3x）
width 编号 ❌ - 特定宽度（不含比例）
height 编号 ❌ - 特定高度（不含刻度）
background string ❌ 透明 十六进制颜色或“透明”

示例（2x视网膜）：

{
  "inputPath": "/path/to/logo.svg",
  "outputFormat": "webp",
  "scale": 2,
  "quality": 85
}

示例（具体尺寸）：

{
  "inputPath": "/path/to/icon.svg",
  "outputFormat": "png",
  "width": 512,
  "height": 512,
  "background": "#ffffff"
}

3. batch_convert -批量转换

在一次操作中转换目录中的多个图像。

参数：

参数 类型 必填 默认 说明
inputDir string ✅ - 包含源图像的目录
outputFormat 枚举 ✅ - webp, png，或 jpeg
pattern string ❌ *.{svg,png,jpg,jpeg} 用于文件选择的球形图案
quality 编号 ❌ 80 质量（1-100）
outputDir string ❌ same 输出目录
recursive boolean ❌ false 搜索子目录

例子：

{
  "inputDir": "/path/to/images",
  "outputFormat": "webp",
  "pattern": "*.svg",
  "quality": 85
}

答复：

{
  "success": true,
  "results": [
    {
      "inputPath": "/path/to/images/logo.svg",
      "outputPath": "/path/to/images/logo.webp",
      "status": "success"
    }
  ],
  "summary": {
    "total": 10,
    "successful": 9,
    "failed": 1,
    "totalSizeBefore": 2450300,
    "totalSizeAfter": 890120
  }
}

4. get_image_info -图像元数据

在不转换图像的情况下获取有关图像的详细信息。

参数：

参数 类型 必填 说明
inputPath string ✅ 图像文件的绝对路径

例子：

{
  "inputPath": "/path/to/image.png"
}

答复：

{
  "format": "png",
  "width": 1920,
  "height": 1080,
  "size": 450230,
  "hasAlpha": true,
  "colorSpace": "srgb",
  "orientation": 1
}

质量预设

优化了web性能的默认值：

{
  webp: {
    quality: 80,      // Excellent quality/size balance
    effort: 4,        // Moderate compression effort
    lossless: false
  },
  jpeg: {
    quality: 85,      // High quality
    mozjpeg: true,    // Better compression
    progressive: true // Progressive loading
  },
  png: {
    compressionLevel: 9,  // Maximum compression
    progressive: false    // Lossless format
  }
}

超越质量：通行证 quality 要自定义的参数（1-100）。

Claude桌面配置

添加到您的Claude Desktop配置文件中：

macOS: ~/Library/Application Support/Claude/claude_desktop_config.json 视窗: %APPDATA%\Claude\claude_desktop_config.json

{
  "mcpServers": {
    "image-converter": {
      "command": "node",
      "args": ["/absolute/path/to/image-converter-mcp/dist/index.js"],
      "env": {
        "LOG_LEVEL": "info"
      }
    }
  }
}

开发模式 （使用tsx）：

{
  "mcpServers": {
    "image-converter": {
      "command": "npx",
      "args": ["tsx", "/absolute/path/to/image-converter-mcp/src/index.ts"],
      "env": {
        "LOG_LEVEL": "debug"
      }
    }
  }
}

用例

1.将SVG徽标转换为WebP（标准和Retina）

// Standard
{
  "inputPath": "/assets/logo.svg",
  "outputFormat": "webp",
  "quality": 85
}

// 2x Retina
{
  "inputPath": "/assets/logo.svg",
  "outputFormat": "webp",
  "scale": 2,
  "quality": 85
}

2.优化所有网页PNG

{
  "inputDir": "/assets/images",
  "outputFormat": "webp",
  "pattern": "*.png",
  "quality": 80
}

3.创建响应式图像大小

// Desktop
{
  "inputPath": "/hero.jpg",
  "outputFormat": "webp",
  "width": 1920,
  "quality": 85
}

// Mobile
{
  "inputPath": "/hero.jpg",
  "outputFormat": "webp",
  "width": 768,
  "quality": 80
}

4.将SVG图标转换为带背景的PNG

{
  "inputPath": "/icon.svg",
  "outputFormat": "png",
  "width": 512,
  "height": 512,
  "background": "#ffffff"
}

支持格式

输入：SVG、PNG、JPG、JPEG、WebP、GIF、BMP、TIFF 输出：WebP、PNG、JPEG

错误处理

所有错误都映射到相应的MCP错误代码：

错误类型 MCP代码 示例
找不到文件 InvalidParams File not found: /path/to/image.svg
格式无效 InvalidParams Unsupported format: .txt
验证失败 InvalidParams quality: Must be between 1 and 100
权限被拒绝 InternalError Permission denied: /protected/file.png
转换失败 InternalError Conversion failed: Invalid SVG

日志记录

日志被写入 stderr 为避免干扰MCP stdio传输，请使用JSON格式：

{
  "timestamp": "2025-01-25T10:30:45.123Z",
  "level": "info",
  "message": "Conversion completed",
  "meta": {
    "outputPath": "/path/to/output.webp",
    "compressionRatio": "72.1%"
  }
}

日志级别: debug, info, warn, error 配置：设置 LOG_LEVEL 环境变量

发展

# Install dependencies
npm install

# Build TypeScript
npm run build

# Development mode (auto-reload)
npm run dev

# Type checking
npx tsc --noEmit

项目结构

image-converter-mcp/
├── src/
│   ├── index.ts                 # Server entry point
│   ├── tools/
│   │   └── index.ts             # MCP tool registration
│   ├── converters/
│   │   └── image-converter.ts   # Sharp conversion logic
│   ├── types/
│   │   └── index.ts             # TypeScript types & Zod schemas
│   └── utils/
│       ├── logger.ts            # Structured logging
│       ├── errors.ts            # Error handling
│       └── path-utils.ts        # Path utilities
├── dist/                        # Compiled JavaScript
├── package.json
├── tsconfig.json
└── README.md

需求

  • Node.js: >= 18.0.0
  • 夏普：自动安装特定于平台的二进制文件
  • 操作系统：macOS、Linux、Windows（夏普支持的平台）

许可证

麻省理工学院

贡献

欢迎投稿！请确保：

  • TypeScript严格模式合规性
  • 对所有输入进行Zod模式验证
  • 使用适当的MCP代码进行错误处理
  • 新功能测试
  • 文档更新

鸣谢

内置：

  • 夏普 -高性能图像处理
  • MCP-SDK -模型上下文协议
  • 萨德 -TypeScript第一模式验证

相关 MCP