TypeScript 中的 PDF 生成：库与工具概览

TypeScript 中的 PDF 生成：工具概览

PDF 文档的生成是 Web 开发中的常见任务之一。借助 TypeScript 和强大的库，您可以直接在浏览器或服务器端（Node.js）创建复杂的报告、发票、证书等文档。本文将介绍 TypeScript 中用于处理 PDF 的主要库、它们的特点以及使用示例。

1. jsPDF — 轻量且流行的库

jsPDF 是客户端创建 PDF 最常用的库之一。它允许仅使用 JavaScript/TypeScript 直接在浏览器中生成文档。该库支持文本、图像、表格和基本格式设置。

安装

npm install jspdf @types/jspdf

示例：创建简单的 PDF

import { jsPDF } from 'jspdf';

const doc = new jsPDF();doc.text('你好，世界！', 10, 10);doc.save('document.pdf');

优点与缺点

• ✅ 使用简单
• ✅ 可在浏览器和 Node.js 中运行（需额外模块）
• ❌ 对复杂布局的支持有限
• ❌ 处理表格较困难（需要手动配置）

2. PDFKit — 强大的服务器端生成工具

PDFKit 是一个 Node.js 库，提供对 PDF 创建的完全控制。它非常适合在服务器端生成复杂文档：报告、发票、宣传册。支持字体、渐变、矢量图形和多页文档。

安装

npm install pdfkit @types/pdfkit

示例：创建包含文本和图像的 PDF

import PDFDocument from 'pdfkit';import fs from 'fs';

const doc = new PDFDocument();doc.pipe(fs.createWriteStream('output.pdf'));

doc.fontSize(25).text('标题', 100, 100);doc.image('path/to/image.png', 100, 150, { width: 200 });doc.end();

优点与缺点

• ✅ 灵活且完全可控
• ✅ 支持复杂图形
• ❌ 不能在浏览器中运行（仅限 Node.js）
• ❌ 与 jsPDF 相比，API 更复杂

3. Puppeteer — 从 HTML 生成 PDF

Puppeteer 是一个用于控制 headless Chrome 浏览器的库。它允许将 HTML 页面转换为 PDF，如果您已有文档的布局（例如发票或报告），这会非常方便。适用于客户端和服务器端生成。

安装

npm install puppeteer

示例：从 HTML 生成 PDF

import puppeteer from 'puppeteer';

async function generatePDF() {  const browser = await puppeteer.launch();  const page = await browser.newPage();  await page.setContent('<h1>你好，PDF！</h1><p>这是一份报告。</p>');  await page.pdf({ path: 'report.pdf', format: 'A4' });  await browser.close();}

generatePDF();

优点与缺点

• ✅ 完全利用 CSS 和 HTML
• ✅ 支持复杂布局和样式
• ❌ 需要安装 Chrome（体积较大）
• ❌ 比专用库慢

4. pdfmake — 基于 JSON 结构生成

pdfmake 是一个采用声明式方法的库：您用 JSON 描述文档结构，库会自动构建 PDF。非常适合创建表格、列表和报告。

安装

npm install pdfmake @types/pdfmake

示例：创建包含表格的 PDF

import pdfMake from 'pdfmake/build/pdfmake';import pdfFonts from 'pdfmake/build/vfs_fonts';

pdfMake.vfs = pdfFonts.pdfMake.vfs;

const docDefinition = {  content: [    { text: '报告'