mcpField
T
tech.unravel/mcp-mermaidjs-server

tech.unravel/mcp-mermaidjs-server

本地服务
github.com/unravel-team媒体与设计079 周前更新

关于 tech.unravel/mcp-mermaidjs-server

tech.unravel/mcp-mermaidjs-server 是一个借助 mmdc 保存和渲染 MermaidJS 图表的 MCP 服务,适用于需要通过兼容主机生成图表的场景。它提供保存规格和按指定格式可视化的两个工具。

主要功能

  1. 01保存 MermaidJS 图表规格
  2. 02渲染已保存的图表
  3. 03指定输出格式
  4. 04可选应用 CSS

适用场景

  1. 01将图表规格保存为文件
  2. 02把已保存规格渲染为图像或其他格式

MCP 相关

该服务向 MCP 主机提供保存图表规格和渲染图表的工具;运行时需要安装 mmdc 命令行工具。

配置

本地服务的配置在各客户端中通用,复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
"mcpServers": {
"mermaidjs-server": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/inspector"
]
}
}
}
启动命令npx -y @modelcontextprotocol/inspector

本地服务需要在你的电脑上安装运行环境(如 Node.js 18+)。各客户端的配置文件位置不同,请参考客户端文档。

安装包
npm@modelcontextprotocol/inspector

工具

还没有获取到工具列表

本地服务需要在你的电脑上运行后才能读取工具,维护者暂未提供工具列表。

详细介绍

tech.unravel/mcp-mermaidjs-server

一个使用 mmdc 处理 MermaidJS 的 MCP 服务。

我们创建了两个简单的工具:

  • save-diagram
  • visualize-diagram

使用这些工具,宿主可以通过以下方式创建精美的 mermaid-js 图表:

  • 创建 mmd 规范并保存
  • 然后使用指定的输出格式和(可选的)CSS 渲染已保存的规范(通过访问 mmdc)

使用方法

构建 Uberjar
  1. make clean && make build
运行 MCP 服务

前置条件:需要安装 mmdc CLI。

可以在 Claude Desktop 或 Inspector 中尝试以下示例命令:

  1. 根据此规范创建 MermaidJS 时序图:
sequenceDiagram
%% See https://mermaidjs.github.io/sequenceDiagram.html

loop everyday D-2 working days 16:00
    ABCD->>DEE: [14:25] BEE (Calculation per TC until ACK becomes OK)

    ABCD->>FGG: BEE (Calculation per TC until ACK becomes OK)
    Note over ABCD,FGG: D-2 weekdays at 14:25
    ABCD->>HII: Projected Authorisations to HII
    Note over ABCD,HII: D-2 weekdays at 16:00
end

loop D-1 before deadline at 7:45
    HII->>DEE: Submission
    Note over HII,DEE: D-1 before deadline
    HII->>FGG: Submission
    Note over HII,FGG: D-1 before deadline
end
运行 MCP 服务前

请记住:

  1. 将 tech.unravel/mcp-mermaidjs-server Jar 的完整路径替换为系统上的正确路径(例如,将下方的 /Users/vedang/repo-name 替换为正确路径)
  2. 指定系统上 mmdc 的完整路径
在 Claude Desktop 中
    "mcp_mermaidjs_server": {
      "command": "java",
      "args": [
        "-Dclojure.tools.logging.factory=clojure.tools.logging.impl/log4j2-factory",
        "-Dorg.eclipse.jetty.util.log.class=org.eclipse.jetty.util.log.Slf4jLog",
        "-Dlog4j2.contextSelector=org.apache.logging.log4j.core.async.AsyncLoggerContextSelector",
        "-Dlog4j2.configurationFile=log4j2-mcp.xml",
        "-Dbabashka.json.provider=metosin/jsonista",
        "-Dlogging.level=INFO",
        "-Dmcp.vegalite.mmdc_executable=/Users/vedang/.local/share/nvm/v23.11.0/bin/mmdc",
        "-cp",
        "/Users/vedang/repo-name/target/tech.unravel/mcp-mermaidjs-server-1.0.0.jar",
        "tech.unravel.mcp-mermaidjs-server"
      ]
    }
在 MCP Inspector 中

请记住使用系统上 tech.unravel/mcp-mermaidjs-server JAR 的完整路径。

npx @modelcontextprotocol/inspector java -Dclojure.tools.logging.factory=clojure.tools.logging.impl/log4j2-factory -Dorg.eclipse.jetty.util.log.class=org.eclipse.jetty.util.log.Slf4jLog -Dlog4j2.contextSelector=org.apache.logging.log4j.core.async.AsyncLoggerContextSelector -Dlog4j2.configurationFile=log4j2-mcp.xml -Dbabashka.json.provider=metosin/jsonista -Dlogging.level=INFO -Dmcp.vegalite.mmdc_executable=/Users/vedang/.local/share/nvm/v23.11.0/bin/mmdc -cp /Users/vedang/repo-name/target/tech.unravel/mcp-mermaidjs-server-1.0.0.jar tech.unravel.mcp-mermaidjs-server

许可证

版权所有 © 2025 Unravel.tech Engineering

根据 MIT 许可证分发

评论

支持 Markdown

第一次接触 MCP?

从协议是什么,到在客户端里装上第一个服务,这几条回答覆盖了大多数入门问题。

一个开放协议,规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话,MCP 服务负责提供工具、资源和提示模板,两者通过标准消息通信,同一个服务可以被不同客户端复用。