Vue.js Mozilla PDF.js pdfvuer Module PDF Viewer Example to Display PDF Documents in Browser Using Javascript Full Project For Beginners

You are currently viewing Vue.js Mozilla PDF.js pdfvuer Module PDF Viewer Example to Display PDF Documents in Browser Using Javascript Full Project For Beginners
  • Post author:
  • Post category:Vue
  • Post comments:0 Comments

 

Welcome folks today in this blog post we will be looking at a pdf viewer component in vue.js using mozilla pdf.js library pdfvuer in javascript . All the full source code of the application is shown below.

 

Get Started

 

Built With

  • Vue.js
  • PDF.js
  • pdfvuer

Usage

Prerequisites

  • node
  • npm

Now execute the below command to install the below npm module

 

npm i pdfvuer

 

or you can clone the repository which is given below

 

Clone the repository to your local machine

Change into the project directory

Install dependencies

Start development server

 

 

Feature

  • read a PDF from url/local file/asset and can cache it.
  • display horizontally or vertically
  • drag and zoom
  • double tap for zoom
  • support password protected pdf
  • jump to a specific page in the pdf

 

In order to get started you need to create new vue.js project and then you need to download the entire full source code on github repository

 

DOWNLOAD SOURCE CODE

 

Now after downloading the source code the directory structure will look something like this as shown below

 

 

Live Demo

 

 

Vue.js PDF Viewer Example

 

 

Basic Example

 

 

 

 

Advanced Example

 

 

 

 

Screenshot

 

 

Leave a Reply