Legacy Browser Support

To support older browsers, Vue PDF Viewer provides a polyfills entry point. You need to:

1. Import @vue-pdf-viewer/viewer/polyfills at the top of your app's entry file
2. Override the worker import to use the legacy build

Step 1: Import Polyfills

Add the polyfills import as the first import in your app's entry file so the polyfills are applied before any other code runs.

Vue 3

Add the import to your main.ts (or main.js):

import { createApp } from 'vue'
import App from './App.vue'
import '@vue-pdf-viewer/viewer/polyfills'

createApp(App).mount('#app')

Step 2: Override Worker Import

Use the legacy worker build regardless of which pdfjs-dist version you are using:

<script setup>
import { VPdfViewer } from '@vue-pdf-viewer/viewer'
import pdfWorker from '@vue-pdf-viewer/viewer/assets/pdf-legacy/pdf.worker.min.mjs?url'
</script>
<template>
  <VPdfViewer :workerUrl="pdfWorker" src="..." />
</template>

If you override the pdfjs-dist version, import the legacy worker from that package instead:

<script setup>
import { VPdfViewer } from '@vue-pdf-viewer/viewer'
import pdfWorker from 'pdfjs-dist/legacy/build/pdf.worker?url'
</script>
<template>
  <VPdfViewer :workerUrl="pdfWorker" src="..." />
</template>

WARNING

Passing workerUrl overrides the viewer's automatic legacy-worker selection. Browsers without Promise.withResolvers will use exactly the worker you provide, so make sure it is the legacy build.