PDF генерация в TypeScript: библиотеки и инструменты |…

PDF генерация в TypeScript: обзор инструментов

Генерация PDF-документов — одна из частых задач в веб-разработке. Благодаря TypeScript и мощным библиотекам, вы можете создавать сложные отчёты, счета, сертификаты и другие документы прямо в браузере или на сервере (Node.js). В этой статье мы рассмотрим основные библиотеки для работы с PDF в TypeScript, их особенности и примеры использования.

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)
❌ Более сложный API по сравнению с jsPDF

3. Puppeteer — генерация из HTML в PDF

Puppeteer — это библиотека для управления headless-браузером Chrome. Она позволяет конвертировать HTML-страницы в PDF, что удобно, если у вас уже есть вёрстка документа (например, счёт или отчёт). Подходит как для клиентской, так и для серверной генерации.

Установка

npm install puppeteer

Пример: генерация PDF из HTML

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: 'Отчёт', style: 'header' },
    {
      table: {
        body: [
          ['Имя', 'Возраст'],
          ['Анна', '25'],
          ['Иван', '30'],
        ],
      },
    },
  ],
  styles: {
    header: { fontSize: 18, bold: true },
  },
};

pdfMake.createPdf(docDefinition).download('report.pdf');