vue-pdf-export

Vue 3 + TypeScript browser PDF export component and composable with Canvas rendering, selectable PDF text, pagination, headers, footers, watermarks, progress tracking, security options, and Nuxt-safe imports.

Playground

• Live playground: https://vue-pdf-export-playground.vercel.app/
• Full documentation: https://vue-pdf-export-docs.vercel.app/

Features

• Canvas and selectable-text PDF rendering
• Automatic and manual pagination
• Preview, download, and native browser print
• Blob, ArrayBuffer, Base64, and PDF data-URL output
• Headers and footers with page targeting
• Text and image watermarks
• Password protection, permissions, metadata, and compression
• Clickable PDF links
• Progress reporting, generation metrics, and cancellation
• data-pdf-ignore for export-only DOM control
• PDF-only page/body styling and custom CSS
• Large-document rendering optimizations
• Nuxt 3 and Nuxt 4 SSR-safe imports
• TypeScript declarations
• npm, pnpm, Yarn, Yarn PnP, and Bun consumer validation

For detailed API options, examples, renderer notes, styling, pagination, security, SSR guidance, and production recommendations, see the full documentation.

Installation

npm install vue-pdf-export

Other package managers:

pnpm add vue-pdf-export
yarn add vue-pdf-export
bun add vue-pdf-export

Quick start

<script setup lang="ts">
import { ref } from 'vue'
import { Html2Pdf } from 'vue-pdf-export'
import 'vue-pdf-export/style.css'

const pdfRef = ref<InstanceType<typeof Html2Pdf> | null>(null)
</script>

<template>
  <button type="button" @click="pdfRef?.generatePdf()">Generate PDF</button>

  <Html2Pdf ref="pdfRef" filename="example.pdf" render-mode="canvas">
    <template #pdf-content>
      <main>
        <h1>Hello from Vue</h1>
        <p>This content will be exported to PDF.</p>
      </main>
    </template>
  </Html2Pdf>
</template>

Use selectable/searchable PDF text when needed:

<Html2Pdf render-mode="text">
  <!-- PDF content -->
</Html2Pdf>

Programmatic output

const blob = await pdfRef.value?.generatePdf()

const arrayBuffer = await pdfRef.value?.generatePdfArrayBuffer()

const base64 = await pdfRef.value?.generatePdfBase64()

For large PDFs, Blob remains the recommended browser-side default.

Nuxt

vue-pdf-export is safe to import in Nuxt 3 and Nuxt 4 SSR environments. Actual PDF generation is browser-side.

<ClientOnly>
  <Html2Pdf>
    <!-- PDF content -->
  </Html2Pdf>
</ClientOnly>

See the Nuxt 3 & Nuxt 4 SSR guide for integration details.

Documentation

The complete documentation lives separately so this README can stay focused and easy to scan.

• Introduction
• Installation
• Quick Start
• Rendering Modes
• Nuxt 3 & Nuxt 4 SSR
• Programmatic API
• PDF Styling
• Playground & Stress Tests

Feedback

The package source is currently maintained privately.

Feature requests, bug reports, API feedback, and real-world PDF edge cases are welcome through the public feedback board:

Feature requests & feedback

Acknowledgements

Selectable-text rendering in vue-pdf-export is based on and adapted from @timkozlov/html-to-pdf, created by @Canelex and released under the MIT License.

Upstream project: https://github.com/Canelex/html-to-pdf

The original license notice is retained with the vendored source.

License

MIT © 2026 Saurabh Choudhary

Third-party vendored code remains subject to its original copyright and license notices.