P5.JS & jsPDF cant use 2.4.0 but 1.3.3 works

p5.js Libraries
1

Hello

Trying to upgrade jsPDF library to the latest version but

Currently using this

<script src="//cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.3/jspdf.min.js"></script>

Swapping it out for this

<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>

I get:

Uncaught ReferenceError: jsPDF is not defined

Any help would be great,

2

To test if jsPDF library is fully loading I’ve created this “index.html” file:

<script async src=https://cdn.JsDelivr.net/npm/p5></script>
<script defer src=https://Unpkg.com/jspdf/dist/jspdf.umd.min.js></script>
<!-- <script defer src=sketch.js></script> -->

<script>
  onload = function () {
    console.log('p5js:',  globalThis.p5);
    console.log('jsPDF:', globalThis.jsPDF);
    console.log('jspdf:', globalThis.jspdf);
    console.log('jspdf.jsPDF:', globalThis.jspdf.jsPDF);
  }
</script>

Indeed jsPDF is undefined. But interestingly jspdf exists!

And also there’s a jsPDF attached to jspdf.

BtW, you can create a global variable to directly access jsPDF like this:
const { jsPDF } = jspdf;

3

Seems like this is a common case for UMD packed files.

That is, they have a namespace object which wraps up their actual main constructor.

For the jsPDF library we have a namespace jspdf and a main constructor jsPDF inside jspdf.

I had to do the same for the ml-matrix library:

In its UMD format ml-matrix has a namespace mlMatrix and a constructor Matrix inside mlMatrix:

4

Awesome thanks for your help it’s now working