vue-pdfjs-demo

vue-pdfjs-demo

This project demonstrates how a simple PDF viewer could be implemented using Vue and PDF.js. This is not a fully-featured PDF document viewer with sophisticated controls, but could serve as the basis for one.

To learn more, checkout the series of posts describing how this project was implemented.

1. Basic page rendering
2. Fetching and rendering lazily
3. Extracting a data component
4. Refactoring to nested abstract components

Setup

To install the plugin inside your project :

$ npm install vue-pdfjs-demo

Then, copy this code where you want inside you project :

<template>

  <VuePdfJs class="grey"
            :url="url"
  />

</template>

<script>
import VuePdfJs from "vue-pdfjs-demo/src/App.vue";

export default {
  components: {
    VuePdfJs
  },
    data: () => ({
    url:'https://cors-anywhere.herokuapp.com/YourUrl.pdf'
  })
}
</script>

Some details still need to be fixed. For example :

• Backgrounds
• icons
• css styles

Documentation

• Vue.js
• PDF.js