Генерация PDF отчётов на TypeScript: библиотеки и инструменты

Генерация PDF отчётов на TypeScript: обзор библиотек и практические примеры

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

Зачем использовать TypeScript для генерации PDF?

TypeScript добавляет статическую типизацию, что значительно упрощает разработку сложных систем генерации отчётов. IDE обеспечивает автодополнение, проверку типов и рефакторинг, что снижает количество ошибок. Кроме того, TypeScript-код легко поддерживать и масштабировать, особенно в больших проектах.

Основные библиотеки для генерации PDF на TypeScript

Рассмотрим три наиболее популярных инструмента: PDFKit, jsPDF и Puppeteer. Каждый из них имеет свою нишу и особенности.

1. PDFKit

PDFKit — это мощная библиотека для создания PDF-документов на Node.js. Она полностью написана на JavaScript и поддерживает TypeScript через определение типов (@types/pdfkit). PDFKit позволяет создавать документы с нуля, добавлять текст, изображения, векторную графику, таблицы и многое другое.

Преимущества:

• Полный контроль над содержимым и структурой PDF.
• Поддержка шрифтов, цветов, прозрачности.
• Встроенная поддержка кириллицы (при подключении шрифтов).
• Высокая производительность.

Пример использования PDFKit с TypeScript:

import PDFDocument from 'pdfkit';
import * as fs from 'fs';

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

doc.fontSize(25).text('Отчёт о продажах', 100, 100);
doc.fontSize(12).text('Дата: 2025-03-15', 100, 150);
doc.moveDown();

doc.text('Наименование: Ноутбук');
doc.text('Количество: 10');
doc.text('Сумма: 1 200 000 руб.');

doc.end();

Для корректной работы с кириллицей необходимо подключить шрифт, например:

doc.registerFont('Roboto', 'fonts/Roboto-Regular.ttf');
doc.font('Roboto').text('Привет, мир!');

2. jsPDF

jsPDF — это клиентская библиотека для генерации PDF прямо в браузере. Она также имеет типы для TypeScript. jsPDF отлично подходит для создания простых отчётов, счетов и накладных без серверной обработки.

Преимущества:

• Работает на стороне клиента (не нужен сервер).
• Простая настройка и использование.
• Поддержка HTML-вёрстки через плагин html2canvas.

Пример использования jsPDF с TypeScript:

import { jsPDF } from 'jspdf';

const doc = new jsPDF();
doc.setFontSize(18);
doc.text('Отчёт по проекту', 10, 20);
doc.setFontSize(12);
doc.text('Выполнено: 75%', 10, 40);
doc.text('Бюджет: 2 500 000 руб.', 10, 50);

doc.save('project-report.pdf');

Важно: jsPDF не поддерживает кириллицу "из коробки". Для работы с русским текстом нужно загружать шрифты через addFileToVFS и addFont.

3. Puppeteer

Puppeteer — это библиотека для управления браузером Chrome/Chromium через протокол DevTools. Она позволяет генерировать PDF из HTML/CSS с максимальной точностью, так как использует реальный рендеринг браузера. Puppeteer имеет официальные TypeScript-типы.

Преимущества:

• Полная поддержка CSS, Flexbox, Grid, кириллицы.
• Возможность создавать отчёты на основе HTML-шаблонов.
• Поддержка сложной вёрстки и изображений.

Пример использования Puppeteer с TypeScript:

import puppeteer from 'puppeteer';

async function generatePDF() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  const html = `<h1>Отчёт о прибыли</h1>
    <p>Прибыль за март: 450 000 руб.</p>
    <table>