Generierung von PDF-Berichten in TypeScript

Generierung von PDF-Berichten in TypeScript: Überblick über Bibliotheken und praktische Beispiele

Die Generierung von PDF-Dokumenten ist eine der Kernaufgaben bei der Entwicklung moderner Webanwendungen und Unternehmenssysteme. Berichte, Rechnungen, Zertifikate, Analyse-Dashboards – all dies erfordert ein praktisches und flexibles Werkzeug zur PDF-Erstellung auf Server- oder Client-Seite. TypeScript, als streng typisierte Erweiterung von JavaScript, bietet hervorragende Möglichkeiten zur Implementierung solcher Funktionalitäten. In diesem Artikel betrachten wir die wichtigsten Bibliotheken zur PDF-Generierung in TypeScript, ihre Besonderheiten, Vorteile und Anwendungsbeispiele.

Warum TypeScript für die PDF-Generierung verwenden?

TypeScript fügt statische Typisierung hinzu, was die Entwicklung komplexer Berichtsgenerierungssysteme erheblich vereinfacht. Die IDE bietet Autovervollständigung, Typprüfung und Refactoring, was die Anzahl der Fehler reduziert. Darüber hinaus ist TypeScript-Code leicht zu warten und zu skalieren, insbesondere in großen Projekten.

Wichtigste Bibliotheken zur PDF-Generierung in TypeScript

Betrachten wir die drei beliebtesten Werkzeuge: PDFKit, jsPDF und Puppeteer. Jedes hat seine eigene Nische und Besonderheiten.

1. PDFKit

PDFKit ist eine leistungsstarke Bibliothek zur Erstellung von PDF-Dokumenten in Node.js. Sie ist vollständig in JavaScript geschrieben und unterstützt TypeScript über Typdefinitionen (@types/pdfkit). PDFKit ermöglicht die Erstellung von Dokumenten von Grund auf, das Hinzufügen von Text, Bildern, Vektorgrafiken, Tabellen und vielem mehr.

Vorteile:

Vollständige Kontrolle über Inhalt und Struktur des PDF.
Unterstützung für Schriftarten, Farben, Transparenz.
Integrierte Unterstützung für Kyrillisch (bei Einbindung von Schriftarten).
Hohe Leistung.

Beispiel für die Verwendung von PDFKit mit TypeScript:

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

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

doc.fontSize(25).text('Verkaufsbericht', 100, 100);doc.fontSize(12).text('Datum: 2025-03-15', 100, 150);doc.moveDown();

doc.text('Bezeichnung: Laptop');doc.text('Menge: 10');doc.text('Betrag: 1.200.000 Rubel');

doc.end();

Für die korrekte Arbeit mit Kyrillisch muss eine Schriftart eingebunden werden, zum Beispiel:

doc.registerFont('Roboto', 'fonts/Roboto-Regular.ttf');doc.font('Roboto').text('Hallo Welt!');

2. jsPDF

jsPDF ist eine Client-Bibliothek zur PDF-Generierung direkt im Browser. Sie verfügt ebenfalls über Typen für TypeScript. jsPDF eignet sich hervorragend für die Erstellung einfacher Berichte, Rechnungen und Lieferscheine ohne Serververarbeitung.

Vorteile:

Funktioniert auf der Client-Seite (kein Server erforderlich).
Einfache Einrichtung und Verwendung.
Unterstützung für HTML-Layout über das Plugin html2canvas.

Beispiel für die Verwendung von jsPDF mit TypeScript:

import { jsPDF } from 'jspdf';

const doc = new jsPDF();doc.setFontSize(18);doc.text('Projektbericht', 10, 20);doc.setFontSize(12);doc.text('Abgeschlossen: 75%', 10, 40);doc.text('Budget: 2.500.000 Rubel', 10, 50);

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

Wichtig: jsPDF unterstützt Kyrillisch nicht "von Haus aus". Für die Arbeit mit russischem Text müssen Schriftarten über addFileToVFS und addFont geladen werden.

3. Puppeteer

Puppeteer ist eine Bibliothek zur Steuerung des Chrome/Chromium-Browsers über das DevTools-Protokoll. Sie ermöglicht die PDF-Generierung aus HTML/CSS mit höchster Genauigkeit, da sie das tatsächliche Browser-Rendering verwendet. Puppeteer verfügt über offizielle TypeScript-Typen.

Vorteile: