Easily add pdfMake to your Nuxt application.
usePDFMakecomposable auto-imported on the client- Server-side PDF generation via
createPDFBuffer,createPDFBase64, anduseServerPDFMake - Pre-built
POST /_pdfmake/generateAPI endpoint (dev only by default) - Font management — embed custom fonts, load Google Fonts at build time, or reference CDN URLs
- Nuxt DevTools panel to inspect fonts and module config
# Using bun
bun add -D nuxt-pdfmake
# Using pnpm
pnpm add -D nuxt-pdfmake
# Using yarn
yarn add --dev nuxt-pdfmake
# Using npm
npm install --save-dev nuxt-pdfmakeAdd nuxt-pdfmake to the modules section of nuxt.config.ts:
export default defineNuxtConfig({
modules: ["nuxt-pdfmake"],
});That's it! You can now use Nuxt PDFMake in your Nuxt app ✨
Use the auto-imported usePDFMake composable inside a Vue component:
const pdfMake = usePDFMake();
const doc = pdfMake!.createPdf({ content: ["Hello, world!"] });
doc.open(); // opens in a new browser tab
doc.download("my-file.pdf");Or access the instance directly via the Nuxt app plugin:
const { $pdfMake } = useNuxtApp();Use the server utilities inside server/api/ or server/routes/:
// server/api/report.get.ts
export default defineEventHandler(async (event) => {
const buffer = await createPDFBuffer({ content: ["Hello from the server!"] });
setHeader(event, "Content-Type", "application/pdf");
return buffer;
});| Utility | Returns | Description |
|---|---|---|
createPDFBuffer(docDefinition) |
Promise<Buffer> |
Generate a PDF as a Node.js Buffer |
createPDFBase64(docDefinition) |
Promise<string> |
Generate a PDF as a base64 string |
useServerPDFMake() |
pdfmake instance | Access the raw server-side pdfmake instance |
A POST /_pdfmake/generate endpoint is included and enabled in development. Send a docDefinition in the request body to receive a PDF:
const { data } = await useFetch("/_pdfmake/generate", {
method: "POST",
body: { docDefinition: { content: ["Hello, PDF!"] } },
responseType: "blob",
});To enable in production, set
enableApiRoute: truein your module options and add your own auth middleware.
Configure fonts via the pdfmake key in nuxt.config.ts:
export default defineNuxtConfig({
modules: ["nuxt-pdfmake"],
pdfmake: {
fonts: {
// Local font files (embedded as base64 at build time — ~270 KB per variant)
custom: {
MyFont: {
normal: "assets/fonts/MyFont-Regular.ttf",
bold: "assets/fonts/MyFont-Bold.ttf",
},
},
// Google Fonts downloaded and cached at build time (~1 MB per family)
googleFonts: ["Roboto", "Lato"],
// CDN/HTTP URLs fetched at PDF-creation time
cdn: {
OpenSans: {
normal: "https://fonts.example.com/OpenSans-Regular.ttf",
},
},
// Set to false to opt out of the default Roboto font
useDefaultRoboto: true,
},
},
});When no fonts are configured, the default Roboto font from the pdfmake CDN is used automatically.
| Option | Type | Default | Description |
|---|---|---|---|
enabled |
boolean |
true |
Enable or disable the module |
enableComposable |
boolean |
true |
Auto-import usePDFMake and server utilities |
enableDevtools |
boolean |
true |
Show the PDFMake panel in Nuxt DevTools |
enableApiRoute |
boolean |
true (dev only) |
Expose POST /_pdfmake/generate |
fonts.custom |
Record<string, TFontFamilyTypes> |
— | Local font files embedded at build time |
fonts.googleFonts |
string[] |
— | Google Font family names fetched at build time |
fonts.cdn |
Record<string, TFontFamilyTypes> |
— | CDN font URLs passed directly to pdfmake |
fonts.useDefaultRoboto |
boolean |
true (when no fonts set) |
Include pdfmake's default Roboto CDN font |
# Install dependencies
bun install
# Generate type stubs
bun run dev:prepare
# Develop with the playground
bun run dev
# Build the playground
bun run dev:build
# Run linter
bun run lint
# Run tests
bun run test
bun run test:watch
# Build the module
bun run prepack
# Release a new version
bun run release