JSFiddle - React, Tailwind, and code Playground

by igalst

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<button id="btn">Save PDF</button>

<div id="element-to-print">

example :))))))
</div>

CSS

#element-to-print {
  font-size: 50px;
}

JavaScript

import { jsPDF } from "jsPDF"

function generatePDF() {
  const doc = new jsPDF({ unit: 'pt' }) // create jsPDF object
  const pdfElement = document.getElementById('element-to-print') // HTML element to be converted to PDF

  doc.html(pdfElement, {
    callback: (pdf) => {
      pdf.save('MyPdfFile.pdf')
    },
    margin: 32, // optional: page margin
    // optional: other HTMLOptions
  })
}

document.getElementById('btn').addEventListener('click', generatePDF, false)