React PDF Pro -- PDF Generation for Next.js 16

When to Use

Trigger on any mention of: react-pdf, @react-pdf/renderer, pdf export, pdf template, cv template, pdf download, vietnamese font, renderToBuffer, PDFViewer, PDFDownloadLink, pdf styling.

Reference Files

File	Description
`references/setup.md`	Version compatibility matrix, next.config.ts setup, installation, import patterns, font registration singleton
`references/vietnamese-fonts.md`	Be Vietnam Pro registration (9 weights + italics), practical 4-weight setup, hyphenation callback, self-hosting
`references/components.md`	Document, Page, View, Text, Image, Link, Note, Canvas, PDFViewer, PDFDownloadLink, BlobProvider, SVG primitives
`references/styling.md`	StyleSheet API, valid units, flexbox, dimensions, spacing, colors, text, borders, transforms, media queries
`references/cv-templates.md`	Classic (single column), Modern (accent bar), Creative (2-column sidebar) layouts with ASCII diagrams
`references/server-rendering.md`	renderToBuffer, renderToStream, renderToFile, renderToString, API route patterns
`references/client-preview.md`	PDFViewer dynamic import, usePDF hook, PDFDownloadLink patterns
`references/errors.md`	18 error entries (PDF-001 through PDF-018) with exact messages, causes, and fixes
`references/performance.md`	Font subsetting, image optimization, memoization, large documents, LRU caching strategy
`references/testing.md`	Vitest mocking, template output tests, font registration tests, API route tests, visual regression
`references/code-examples.md`	Complete font registration, full export API route, CV template with Vietnamese font
`references/advanced-examples.md`	Live preview with template switching, export button, two-column sidebar CV, react-pdf vs Puppeteer, sources

Error Quick Lookup

ID	Error	Fix
PDF-001	`require() of ES Module not supported`	`serverExternalPackages: ["@react-pdf/renderer"]`
PDF-002	`PDFViewer is a web specific API`	`dynamic(() => import(...), { ssr: false })`
PDF-003	`Font family not registered`	Call `registerFonts()` before render; match family name
PDF-004	`ba.Component is not a constructor`	Upgrade Next.js to 14.1.1+; set `serverExternalPackages`
PDF-005	`Buffer is not assignable to BodyInit`	`new Uint8Array(buffer)`
PDF-006	`renderToBuffer()` type mismatch	Cast: `component as any`
PDF-007	`DOMMatrix is not defined`	Use `ssr: false` for all client PDF components
PDF-008	`document is not defined`	Dynamic import with `ssr: false`
PDF-009	Vietnamese chars as boxes/`?`	Register Unicode font (Be Vietnam Pro)
PDF-010	Variable font wrong weight	Use static TTF files, register each weight
PDF-011	`Cannot find module 'zlib'`	`serverExternalPackages` + dynamic import
PDF-012	`usePDF` stuck loading	Check font URLs (CORS, 404, format)
PDF-013	`PDFDocument is not a constructor`	`serverExternalPackages` + `dynamic = "force-dynamic"`
PDF-014	ESM/CJS conflict in Jest	Migrate to Vitest
PDF-015	Page wrapping cuts content	`wrap={true} minPresenceAhead={50}`
PDF-016	`__dirname is not defined`	Handled by `serverExternalPackages`
PDF-017	Font weight fallback wrong	Register all weights you use
PDF-018	`Minified React error #31`	Ensure Text children are strings; use v4.1.0+

Key Patterns

Vietnamese Font Registration

import { Font } from '@react-pdf/renderer'

Font.register({
  family: 'BeVietnamPro',
  fonts: [
    { src: 'https://fonts.gstatic.com/s/bevietnampro/v12/...400.ttf' },
    { src: 'https://fonts.gstatic.com/s/bevietnampro/v12/...700.ttf', fontWeight: 700 },
  ]
})

Font.registerHyphenationCallback((word) => [word])  // Prevent Vietnamese splitting

Export API Route

// app/api/export/[id]/route.ts
import { renderToBuffer } from '@react-pdf/renderer'

export async function GET(req, { params }) {
  const { id } = await params
  const buffer = await renderToBuffer(<CVTemplate data={cvData} /> as any)
  return new Response(new Uint8Array(buffer), {
    headers: { 'Content-Type': 'application/pdf' }
  })
}

Client Preview (Dynamic Import)

const PDFViewer = dynamic(
  () => import("@react-pdf/renderer").then((mod) => mod.PDFViewer),
  { ssr: false }
)

react-pdf-pro

React PDF Pro -- PDF Generation for Next.js 16

When to Use

Reference Files

Error Quick Lookup

Key Patterns

Vietnamese Font Registration

Export API Route

Client Preview (Dynamic Import)