toMedia
指南

导出 PDF

将 Fumadocs 文档导出为 PDF 格式

文档建议下载整个网站的 HTML 格式以供离线访问。不过,如果你更喜欢 PDF 导出,可以按照本指南实现。

设置说明

Puppeteer 实现

使用 Puppeteer 将页面转换为 PDF 格式的 TypeScript 脚本:

  • 启动浏览器实例
  • 接受要处理的 URL 路径数组
  • 导航到 localhost:3000 上的每个页面
  • 生成 950px 宽度并启用背景打印的 PDF 文件
  • 使用清理后的命名保存文件(斜杠转换为连字符)

CSS 配置

在 Tailwind CSS 中添加打印媒体样式,以在 PDF 生成时隐藏导航:

@media print {
  #nd-docs-layout {
    --fd-sidebar-width: 0px !important;
  }

  #nd-sidebar {
    display: none;
  }
}

执行

使用以下命令运行脚本:

bun ./scripts/export-pdf.ts

处理隐藏内容

对于包含不可见内容的手风琴和标签页组件,可以用自定义打印版本覆盖 MDX 组件,使其显示所有内容。建议使用环境变量在 PDF 生成期间有条件地渲染简化的组件结构,展开所有隐藏部分。

On this page