PDF代码片段查看器

为代码块添加背景框、等宽字体并支持跳转到Git仓库

生成便于评审的代码片段 PDF，每段带仓库可点击链接。

示例结果

2 个示例

浅色主题多片段预览

渲染两个TypeScript片段并附可点击GitHub链接

code-snippet-viewer-example1.pdf 查看文件
查看输入参数
{ "snippetsJson": "[{\"filePath\":\"src/index.ts\",\"language\":\"ts\",\"startLine\":1,\"endLine\":8,\"code\":\"import { Elysia } from 'elysia'\\n\\nconst app = new Elysia()\\n\\napp.get('/', () => 'ok')\\n\\nexport default app\"},{\"filePath\":\"src/tools/2026-02-13/pdf-link-annotator.ts\",\"language\":\"ts\",\"startLine\":30,\"endLine\":52,\"code\":\"function addExternalLink(pdf, page, x, y, w, h, url) {\\n const annot = pdf.context.obj({\\n Type: 'Annot',\\n Subtype: 'Link',\\n })\\n // ...\\n}\"}]", "repoBaseUrl": "https://github.com/example/repo", "branch": "main", "pageSize": "A4", "landscape": false, "theme": "light" }

深色主题横版评审

单个代码片段，Letter横版深色主题展示

code-snippet-viewer-example2.pdf 查看文件
查看输入参数
{ "snippetsJson": "[{\"filePath\":\"src/tool-manager.ts\",\"language\":\"ts\",\"startLine\":55,\"endLine\":92,\"code\":\"export class ToolManager {\\n private tools = new Map()\\n\\n registerTool(tool) {\\n this.tools.set(tool.id, tool)\\n }\\n\\n getTool(id) {\\n return this.tools.get(id)\\n }\\n}\"}]", "repoBaseUrl": "https://gitlab.com/example/platform", "branch": "develop", "pageSize": "Letter", "landscape": true, "theme": "dark" }

关键信息

分类
文档与 PDF
输入类型
textarea, text, select, checkbox
输出类型
file
样本覆盖
4
支持 API
Yes

概览

PDF代码片段查看器是一款专为开发者设计的工具，能够将代码块快速转换为格式精美、易于评审的 PDF 文档。它支持自定义主题、页面尺寸，并能自动为代码片段添加指向 Git 仓库的跳转链接，极大提升了代码评审与技术文档分享的效率。

适用场景

  • •需要将核心代码逻辑导出为 PDF 以便进行线下或离线代码评审时。
  • •在撰写技术文档或项目报告时，需要插入格式统一且带有仓库跳转链接的代码示例。
  • •需要将多个分散的代码片段整理成一份结构清晰、易于阅读的 PDF 归档文件时。

工作原理

  • •在“代码片段JSON”输入框中，按照指定格式填入文件路径、代码内容及行号信息。
  • •设置仓库基础 URL 和分支名称，以便工具自动生成可点击的跳转链接。
  • •根据需求选择页面尺寸、横向布局及深浅色主题。
  • •点击生成按钮，即可下载包含高亮代码块和仓库链接的 PDF 文档。

使用场景

生成代码评审（Code Review）PDF，方便团队成员在没有 IDE 的环境下进行离线审查。
制作技术分享 PPT 或 PDF 手册，将关键代码逻辑以专业格式呈现。
将项目中的核心算法或工具类代码导出为 PDF 备份，并保留指向源码仓库的快速访问路径。

用户案例

1. 浅色主题多片段评审文档

前端开发工程师
背景原因
需要将两个 TypeScript 模块的代码导出，供技术主管进行离线评审。
解决问题
手动截图代码不仅不清晰，且无法跳转到源码仓库查看上下文。
如何使用
输入代码片段 JSON，设置仓库地址，选择 Light 主题生成 PDF。
示例配置
repoBaseUrl: https://github.com/example/repo, theme: light, pageSize: A4
效果
生成了一份包含两个代码块的 PDF，点击片段标题即可跳转至 GitHub 对应代码行。

2. 深色主题横版代码归档

后端架构师
背景原因
需要将核心工具类代码整理成 PDF 归档，要求视觉风格与深色 IDE 保持一致。
解决问题
常规文档工具无法保持代码的等宽字体和语法高亮，且排版混乱。
如何使用
配置代码片段 JSON，勾选“横向”布局，选择 Dark 主题。
示例配置
repoBaseUrl: https://gitlab.com/example/platform, branch: develop, landscape: true, theme: dark
效果
得到一份横向布局的深色主题 PDF，代码排版整齐，且带有指向 GitLab 的有效链接。

用 Samples 测试

json, pdf
PDF示例
2026-02-01 到 2026-02-10 工具生成的PDF示例
title token pdf
json
二维码示例
用于测试二维码读取和生成工具的示例二维码图像
title token code
json
ELK Stack 日志分析示例
全面的 ELK Stack（Elasticsearch、Logstash、Kibana）示例，用于分布式系统中的日志聚合、处理和可视化
preferred input family json
json
十六进制/Unicode转换样本
十六进制和Unicode转义序列转换的测试样本
preferred input family json
json

相关专题

JSON 交换与格式翻译工具
在一个专题里比较 JSON 与 CSV、YAML、TOML、GraphQL、XML、Markdown、Excel、BSON、EDN 等结构化格式之间的转换工具。
JSON 检查、对比与转换工具
把 JSON 格式化、差异对比、路径检查、Schema 校验、合并、转换和导出工具集中到一个专题中，适合 API 与数据处理流程。
PDF 转换与文档导出工具
在一个专题里比较把文档、图片和结构化内容导入或导出 PDF 的工具，适合发布、分享和下游处理工作流。
JSON Schema、Mock 数据与 API 夹具生成工具
围绕JSON Schema 生成、Mock 负载构建与 API 夹具准备整理的一组工具。

常见问题

我可以自定义 PDF 的主题吗？

可以，工具支持 Light（浅色）和 Dark（深色）两种主题，以适应不同的阅读偏好。

生成的 PDF 中的链接可以直接跳转到 Git 仓库吗？

是的，只要正确配置了仓库基础 URL 和分支，生成的 PDF 中每个代码片段都会包含指向对应文件和行号的超链接。

支持哪些页面尺寸？

目前支持 A4 和 Letter 两种标准的页面尺寸。

代码片段 JSON 格式有什么要求？

需要包含 filePath（文件路径）、language（语言）、startLine（起始行）、endLine（结束行）以及 code（代码内容）字段。

该工具是否支持横向打印布局？

支持，通过勾选“横向”选项，即可将页面布局调整为横向模式，适合展示较长的代码行。

API 文档

请求端点

POST /zh/api/tools/pdf-code-snippet-viewer

请求参数

参数名 类型 必填 描述
snippetsJson textarea 是 -
repoBaseUrl text 否 -
branch text 否 -
pageSize select 否 -
landscape checkbox 否 -
theme select 否 -

响应格式

{
  "filePath": "/public/processing/randomid.ext",
  "fileName": "output.ext",
  "contentType": "application/octet-stream",
  "size": 1024,
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}
文件: 文件

AI MCP 文档

将此工具添加到您的 MCP 服务器配置中： 

{
  "mcpServers": {
    "elysiatools-pdf-code-snippet-viewer": {
      "name": "pdf-code-snippet-viewer",
      "description": "为代码块添加背景框、等宽字体并支持跳转到Git仓库",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=pdf-code-snippet-viewer",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

你可以串联多个工具，比如：`https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`，最多20个。

如果遇见问题，请联系我们：[email protected]