jasy zeichnet Farb-Emoji als echte Vektor-Layer, in reinem TypeScript. Es liest die Tabellen des Color Fonts (COLR / CPAL) selbst und zeichnet jeden Layer - Flächen und Gradients gleichermaßen - direkt ins PDF. Kein Headless-Browser, kein Umweg über ein CDN, kein Bitmap-Ersatz. @react-pdf/renderer dagegen lädt nur Twemoji-PNGs von einem CDN; jasy beherrscht den ganzen Weg selbst.

Einfach das Emoji schreiben

Zeigen Sie das Dokument mit emoji auf eine Emoji-Quelle, registrieren Sie diese Schrift, und Emoji in jedem String erscheinen in Farbe - auch mitten in Ihrer normalen Textschrift.

import { writeFileSync } from "node:fs";
import { Document, Page, Text, renderToBytes } from "@jasy/pdf";

async function build() {
  const doc = Document({ emoji: "NotoColorEmoji" }, [
    Page({ size: "A4", margin: 56 }, [Text("Ready to ship 🚀🎉", { size: 24 })]),
  ]);

  doc.addFont("NotoColorEmoji", "NotoColorEmoji.ttf"); // a COLR/CPAL color font

  writeFileSync("emoji.pdf", await renderToBytes(doc));
}

build();

Der Text selbst bleibt in Ihrer normalen Schrift; nur die Zeichen, die diese Schrift nicht farbig zeichnen kann, kommen aus der Emoji-Quelle. Die Abstände stimmen in jedem Fall, denn Messen und Zeichnen nutzen dieselbe Quelle.

Von einem CDN statt aus einer Schrift

Lieber wie bei react-pdf? Geben Sie emoji eine url, und jasy lädt von dort ein Bild pro Emoji (${url}${codePointHex}.${format}) und bettet es ein, samt Transparenz. Praktisch, wenn Sie keine Schrift ausliefern wollen, auch wenn die Schrift als Quelle kleiner, offline verfügbar und schärfer ist.

const doc = Document(
  {
    emoji: {
      url: "https://cdn.jsdelivr.net/gh/jdecked/twemoji@latest/assets/72x72/",
      format: "png",
    },
  },
  [Page([Text("Shipping with Twemoji 😄")])],
);

Gut zu wissen

Echte Vektoren, reines TS. COLR/CPAL v0 (flache Layer) und v1 (Gradients und Transformationen) werden gelesen und als PDF-Paths und -Shadings gezeichnet - der vollständige Satz von Noto Color Emoji wird dargestellt. Kein Browser, keine JVM.
Ein als Vektoren gezeichneter Color Font wird nicht eingebettet, sie bringt also kein Gewicht durch /FontFile mit.
Bisher einzelne Zeichen. Emoji aus einem Zeichen (~95 % im Alltag) sind abgedeckt; Folgen aus mehreren Zeichen (Flaggen, ZWJ-Kombinationen, Skin-Tone-Modifier) sind zurückgestellt.
Bitmap-Color-Fonts (sbix von Apple Color Emoji, die CBDT-Variante von Noto) und Color Fonts mit CFF-Outlines werden noch nicht gelesen - nehmen Sie eine COLR-Font mit glyf-Outlines wie Noto Color Emoji oder Twemoji, oder die CDN-Quelle.
Auch in Vue, React und Nuxt. Übergeben Sie emoji genau wie oben in den Optionen des Dokuments.