Mozilla's pdf.js viewer.html

Usage no npm install needed!

<script type="module">
  import 4twVueCliPluginPdfjsViewer from 'https://cdn.skypack.dev/@4tw/vue-cli-plugin-pdfjs-viewer';



The mozilla pdf.js viewer as an NPM package.


This vue-cli plugin will copy all the required pdf.js files into the public folder. The viewer will then be available under the following URL: {BASE_URL}/pdfjs/web/viewer.html?file=/example.pdf.

By providing a value for pdfjsPath under pluginOptions the default target path can be overridden. For example by setting the path to public/assets/pdfjs the pdf.js files will be available under {BASE_URL}/assets/pdfjs/web/viewer.html?file=/example.pdf.


In order to update the viewer, pdf.js needs to be built and copied into the assets folder. After copying the following patch must be applied to the viewer.html:

/* Hide upload and bookmark button */
#openFile, #viewBookmark {
  display: none;

NOTE this patch must be added after the viewer.css.