如何将markdown生成pdf

0 阅读4分钟

我已经很习惯用markdown文档记录一些笔记、文章之类的,用.md格式来输出内容,在许多软件平台都可以保存,非常方便。但在有些场景下,你还是需要转成pdf,比如发给上了年纪的领导阅读,或者在一些对外的交流场合用pdf也是更方便演示一些。

介绍下markdown pdf

以下是针对 VS Code 中 Markdown PDF 插件的详细使用指南,涵盖安装、基础操作、高级配置及常见问题解决方案,结合最新实践整理:


📦 一、安装与基础使用

  1. 安装插件

    • 在 VS Code 扩展商店搜索 "Markdown PDF"(作者:yzane),点击安装。
    • 重启 VS Code 才会生效,一定要记得重启。
  2. 快速导出 PDF

    • 打开 Markdown 文件(.md);
    • 右键单击编辑器 → 选择 Markdown PDF: Export (pdf)
    • 或按 Ctrl+Shift+P 打开命令面板 → 输入 Markdown PDF: Export 选择格式(PDF/HTML/PNG/JPEG)。

⚙️ 二、高级配置(通过 settings.json

在 VS Code 设置中搜索 Markdown PDF,或直接编辑 settings.json 文件:

{
  // 基础配置
  "markdown-pdf.outputDirectory": "pdf-output",  // 指定输出文件夹
  "markdown-pdf.convertOnSave": true,           // 保存时自动转换
  "markdown-pdf.type": "pdf",                   // 默认输出格式

  // 样式自定义
  "markdown-pdf.styles": ["/path/to/custom.css"], // 自定义 CSS 文件路径
  "markdown-pdf.cssStyle": "github",            // 内置主题(如 github、atom-dark)

  // 页眉/页脚设置(需 Base64 编码图片)
  "markdown-pdf.headerTemplate": "<div style='font-size: 10px; margin-left: 1cm;'><span>文档标题</span><img src='data:image/png;base64,iVBORw0KGgo...'/></div>",
  "markdown-pdf.footerTemplate": "<div style='text-align: center; font-size: 8px;'>第 <span class='pageNumber'></span> 页</div>",

  // 中文支持(防乱码)
  "markdown-pdf.fontFamily": "Microsoft YaHei, SimSun, sans-serif"
}

🎨 三、关键功能详解

  1. 自定义样式(CSS)

    • 创建 .css 文件(如 markdown-pdf.css),覆盖默认样式:
      body { font-family: "Microsoft YaHei"; line-height: 1.6; }
      pre { background: #f8f8f8; border-radius: 4px; }
      table { border-collapse: collapse; width: 100%; } /* 修复表格压缩问题 */
      
    • 通过 markdown-pdf.styles 引入。
  2. 支持复杂内容

    • Mermaid 图表:直接渲染流程图、甘特图;
    • LaTeX 公式:需额外安装插件(如 Markdown All in One)并配置 MathJax;
    • PlantUML:集成 UML 图导出。
  3. 多引擎导出(解决目录标签问题)

    • 使用 PDF(prince) 引擎可生成带目录标签的 PDF:
      • 安装 PrinceXML 并配置环境变量;
      • 在 Markdown 预览界面右键 → 选择 MPE: Export to PDF (prince)

⚠️ 四、常见问题解决

问题类型解决方案
中文乱码在 CSS 中指定中文字体:body { font-family: "SimSun"; }
LaTeX 公式不显示安装 Markdown+Math 插件,确保启用 MathJax 渲染
表格被横向压缩CSS 添加 table { width: 100% !important; } 或导出时选择“横向打印”
页眉图片过大图片需转为 Base64 编码,且宽度建议 ≤55px

💡 五、最佳实践建议

  1. 自动化工作流
    • 启用 convertOnSave 实现保存即转换,适合频繁更新的文档。
  2. 调试输出效果
    • 先导出为 HTML(markdown-pdf.type: "html"),检查样式后再转 PDF。
  3. 复杂文档处理
    • 对含 Mermaid/LaTeX 的文档,优先用 Prince 引擎导出(需权衡兼容性)。

完整配置参考:官方文档
注:PrinceXML 为付费工具,试用期后可选择其他引擎。遇到问题可查阅插件 GitHub Issues 或社区教程。


再给pdf加个书签

我试了这个给pdf加标签的小工具,这是下载地址,感觉还是比较方便的,不足之处在于生成的目录还要再设置目标进行锚定。


📦 一、 下载安装

从前面提供的下载地址选择一个版本下载,比如我下载的是这个版本pdf-bookmark-1.0.7,解压即可使用了。

🎨 二、使用方法

1、打开工具 解压后进入这个目录:

在当前目录下用powershell终端打开,输入命令:bin/pdf-bookmark,就会弹出这个窗口:

2、选择pdf文件

选择你的pdf文件,然后输入页面偏移量,这个偏移量的用处就是让目录页码与pdf实际页面匹配的,不多解释,自行体会。

3、目录内容

关键的是这一步,目录内空需要你自己输入进去。这个其实有点扯了,因为我如果拿到一个pdf本身就没有目录,这个内容可能也没有。我看官方教程上是可以通过电子书url地址生成,这个没试过,你可以试一下。假如我们自己有目录了,比如你是通过md生成的pdf(本来就是),那目录是很容易用[TOC]拿到的,复制后粘贴上去,然后点击生成目录即可。

4、文件地址 文件地址默认在你当前选中的pdf文件所在位置,很好找,除非你不知道从哪弄来的pdf。

ok,今天的文章就到这里了,希望对你有用。