Using a dynamic import to lazy load some JS

es2020.dynamicImport.after.js

const exportPdfButton = document.querySelector('.exportPdfButton')

exportPdfButton.addEventListener('click', () => {
  import('./pdf-download.js')
    .then(module => {
      // call some exported method in the module
      module.exportPdf()
    })
    .catch(err => {
      // handle the error if the module fails to load
    })
})

// the 'pdf-download.js' module is only imported once the user click the "Export PDF" button