Skip to content
Advertisement

Edit an existing PDF template with parallax / jsPDF

How can I load an existing PDF document as jsPDF object and edit using JavaScript library called parallax / jsPDF which is the top popular JavaScript library for generating PDFs as the time I’m writing this.

enter image description here

I am using the version 2.5.1 the latest as of now.

I searched everywhere and finally I got the answer, wasting too much time. So I decided to put it here so that anyone can refer it faster.

Advertisement

Answer

As at now(28/12/2022) “JsPdf do not have that functionality and probably will never be able to parse existing PDF files. It would mean a major rewrite of its fundamental architecture.” as its contributes states here.

enter image description here

There are other libraries support the same functionality like pdf-lib. I extracted the following from their GitHub page.

pdf-lib was created to address the JavaScript ecosystem’s lack of robust support for PDF manipulation (especially for PDF modification).

Two of pdf-lib’s distinguishing features are:

  1. Supporting modification (editing) of existing documents.
  2. Working in all JavaScript environments – not just in Node or the Browser.

There are other good open source JavaScript PDF libraries available. However, most of them can only create documents, they cannot modify existing ones. And many of them only work in particular environments.

UMD Module

You can also download pdf-lib as a UMD module from unpkg or jsDelivr. The UMD builds have been compiled to ES5, so they should work in any modern browser. UMD builds are useful if you aren’t using a package manager or module bundler. For example, you can use them directly in the tag of an HTML page.

NOTE: if you are using the CDN scripts in production, you should include a specific version number in the URL, for example:

Advertisement