jsPDF is not defined when saving div to PDF

Question

I'm trying to save div element with specific id using jsPDF but getting Uncaught ReferenceError: jsPDF is not defined . Tried bunch of different ways to fix this issue including all available solutions on stackoverflow and none of them worked.

Here is how the div element looks like (it's a table that autofills depending on user choices, I removed most of options to reduce number of lines for this example). Below is a quick snippet to give an idea what's going on. It still says that jsPDF not deifned:

 $('#savePDF').click(function() { var pdf = new jsPDF('p', 'pt', 'letter'); source = $('#yourSummary'); specialElementHandlers = { '#bypassme': function (element, renderer) { return true } }; margins = { top: 80, bottom: 60, left: 40, width: 522 }; pdf.fromHTML( source, margins.left, margins.top, { 'width': margins.width, 'elementHandlers': specialElementHandlers }, function (dispose) { pdf.save('your-summary.pdf'); }, margins ); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script> <div id="yourSummary" class="modal-body"> <table id="yourExterior" class="table table-hover"> <h5>Exterior</h5> <tbody> <tr> <th scope="row">Body colour</th> <td id="sumBC"></td> </tr> </tbody> </table> </div> <button class="btn-primary" id="savePDF">Save configuration as PDF</button>

But once I push the button in browser I have following errors:

Uncaught ReferenceError: jsPDF is not defined
at HTMLButtonElement.<anonymous> (main.js:34)
at HTMLButtonElement.dispatch (jquery-3.5.1.slim.min.js:2)
at HTMLButtonElement.v.handle (jquery-3.5.1.slim.min.js:2)

What am I doing wrong and how to fix this issue?

Answer 1

Use the previous version
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>

The version 2.0.0 is very different.
For an example, instead of the method "jsPDF" you will use jspdf.jsPDF, but you will see new errors.