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.

• Basic page rendering
• Fetching and rendering lazily
• Extracting a data component
• 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