Looking for advice on generating PDFS in React 18

Hi all,

I’m trying to generate dynamic pdfs, to send on request to the client. Unfortunately all free opensource pdf generators either don’t work or return a very poor result in react 18 which is what we are currently running. I’ve managed to get around this by generating a static pdf using the puppeteer library on the server.

My next step is to look into rendering the pdf with dynamic data (for instance from a js file).

I thought that webpack would be able to help here, but so far I’m running into various issues.

The first idea I tried was using lodash to add variables directly into html from html-webpack-plugin.options in config. This didn’t allow me to pull in data from another file to config and display directly into html.

The second idea I tried was adding content from the src/main.js. While this rendered in the browser there were two problems.

  1. The dist/index.html didn’t include any of the dynamic content
  2. When the user tries to save pdf from print, they cannot see colour.

So many questions… Would really appreciate some pointers from people that have generated pdfs before.
Is HTML the best way to generate PDFs?
Are there any legit free open source libraries that are maintained and ready to go with react 18?
Is serverside react or even next.js the best way forward?

Thanks for your help!