📝 Markdown 转 PDF / HTML

实时编辑 Markdown,即时预览渲染效果,一键导出为 PDF 或 HTML 文件

Markdown
预览

欢迎使用 Markdown 转换器

功能特点

  • 实时预览:左侧编辑,右侧即时渲染
  • 导出 PDF:一键将 Markdown 导出为 PDF 文件
  • 导出 HTML:生成干净的 HTML 文件
  • 打开文件:支持直接打开 .md 文件编辑

代码示例

function hello() {
  console.log('Hello, World!');
}

表格示例

功能 状态
Markdown 解析 ✅
PDF 导出 ✅
HTML 导出 ✅

所有处理在浏览器本地完成,数据不上传服务器。

关于Markdown格式转换

了解Markdown语法及PDF/HTML导出的技术原理

Markdown是由John Gruber于2004年创建的轻量级标记语言,如今已成为技术写作的事实标准。GitHub、GitLab、Stack Overflow等平台均采用Markdown作为默认文档格式。其语法简洁直观,用纯文本即可表达标题、列表、代码块、表格等丰富的文档结构。

将Markdown转换为PDF或HTML,本质上是两步过程:首先将Markdown文本解析为抽象语法树(AST),然后将AST渲染为目标格式。图鸭丫工具箱使用marked库完成解析,PDF导出通过html2canvas + jsPDF实现矢量渲染,HTML导出则生成语义化的标准HTML5文档。

工作原理

1

解析Markdown AST

使用marked库将Markdown文本解析为抽象语法树,支持GFM扩展语法

2

渲染HTML

将AST转换为语义化HTML,应用代码高亮和表格样式

3

生成PDF/导出HTML

PDF通过canvas矢量渲染生成,HTML直接输出干净的文档

使用场景

技术文档

将README、API文档等Markdown文件转为PDF便于分享

博客写作

在编辑器中撰写Markdown,导出HTML发布到博客平台

笔记导出

将Obsidian、Typora等工具的笔记导出为通用格式

报告分享

将数据分析报告从Markdown转为PDF,便于邮件发送

常见问题