PDF generation
with JSX.

import puppeteer from 'puppeteer';

// Requires Chrome installed, Docker config,
// 200MB binary, sandbox flags...
const browser = await puppeteer.launch({
  args: ['--no-sandbox', '--disable-setuid-sandbox'],
  executablePath: process.env.CHROME_PATH,
});
const page = await browser.newPage();
await page.setContent(html, { waitUntil: 'networkidle0' });
const pdf = await page.pdf({ format: 'A4' });
await browser.close();

import { renderDocument } from '@formepdf/core';
import { Document, Page, View, Text } from '@formepdf/react';

const pdf = await renderDocument(
  <Invoice data={data} />
);

/* Guess and check. Sometimes works. */
.section { break-inside: avoid; }
.table-row { page-break-inside: avoid; }
/* Nested flex + page breaks = good luck */

@media print {
  .header { position: fixed; top: 0; }
  /* Hope the browser repeats it... */
}

<Table>
  <Row header>
    <Cell>Item</Cell>
    <Cell>Price</Cell>
  </Row>
  {items.map(item => (
    <Row key={item.id}>
      <Cell>{item.name}</Cell>
      <Cell>{item.price}</Cell>
    </Row>
  ))}
  {/* Page breaks handled automatically */}
  {/* Table headers repeat on every page */}
</Table>

FROM node:20

# Install Chrome dependencies (500MB+)
RUN apt-get update && apt-get install -y \
  chromium fonts-liberation \
  --no-install-recommends

ENV PUPPETEER_EXECUTABLE_PATH=/usr/bin/chromium
# Memory limits, cold starts, Lambda layers...

npm install @formepdf/core @formepdf/react

# That's it.
# WASM runs anywhere:
# - Cloudflare Workers
# - Vercel Edge
# - AWS Lambda
# - Browser
# Zero native dependencies.