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