代码高亮SVG转换服务

一个使用PrismJS将源代码转换为带有语法高亮的SVG的服务,适用于开发文档和代码展示。

  • by vaukalak
  • TypeScript
  • 本地部署
  • 更新于
在 GitHub 查看 vaukalak/prismjs-mcp

使用说明

prismjs-mcp 翻译为中文可以是“PrismJS MCP”(假设这是一个特定项目或库的名称,其中“MCP”可能代表某种特定的模块、配置或功能)。不过,具体翻译可能需要根据上下文或该项目/库的实际含义来确定。如果“prismjs-mcp”是一个已知项目或库的名称,建议查找官方或社区提供的中文名称或解释。在没有具体上下文的情况下,上述翻译是一个通用的翻译方式

使用PrismJS将源代码转换为带语法高亮的SVG的MCP服务器。

工具:

  • highlight_svg将高亮代码渲染为SVG。

示例参数:

{
  "code": "const x = 42;\nconsole.log(x);",
  "language": "javascript",
  "width": 800,
  "padding": 16,
  "background": "#1e1e1e",
  "fontSize": 14
}

使用调色板进行主题设计

您可以通过可选参数覆盖输出中使用的颜色 palette 字段并控制CSS color-scheme 通过 colorScheme (别名: colorSchema)。 任何缺失的调色板值将回退到合理的默认值。

支持的调色板键:

  • backgroundSVG背景颜色
  • foreground默认文字颜色
  • comment评论颜色
  • string字符串颜色
  • keyword关键词颜色
  • function函数名的颜色
  • number数字的颜色
  • operator操作符/标点符号的颜色

示例:

{
  "code": "function greet(name){\n  // say hello\n  console.log(`Hello, ${name}!`);\n}",
  "language": "javascript",
  "width": 720,
  "padding": 20,
  "fontSize": 14,
  "palette": {
    "background": "#0b1221",
    "foreground": "#e6edf3",
    "comment": "#8b949e",
    "string": "#a5d6ff",
    "keyword": "#ff7b72",
    "function": "#d2a8ff",
    "number": "#79c0ff",
    "operator": "#c9d1d9"
  },
  "colorScheme": "dark"
}

本地

npm install
npm run build
node dist/server.js

Docker

docker build -t prismjs-mcp .
docker run --rm -i prismjs-mcp