How to generate PDF using custom fonts?

Question

Node.js

There is a server on NextJS on strict TS and, in addition to the main tasks, it is necessary to send some information in the form of PDF.
And here a problem arises, the pdf is collected, sent and received, but since the fonts are not connected when assembling the html, Times New Roman is obtained everywhere, which, obviously, is not good.

So far I have already tried to solve this problem with:

1. html-pdf ─ everything works fine, the pdf is assembled, except that I was not able to attach the fonts. I don’t know what the main problem is, the absolute path, as already indicated, still has zero effect (and yes, I have a WSL console).
   
2. jspdf ─ it is possible, as I understand it, to include fonts without crap, but the problem is that it does not fully work in the node even with the declaration of global variables. I could not fix the function for attaching html.
   
3. puppeteer ─ partially works, but is extremely unstable, pages often crash. However, the fonts are still not applied (if you open the same page that I shove in PDF in the browser, then everything is fine there).
   

I will also add that at the moment the page for pdf is completely rendered on the server as a react component (for the first and second packages), and then it is converted to a string and passed on to collect the pdf.

Answer 1

Solved the problem.
So, I returned to html-pdf and the problem was where and how I specified the absolute path and, which is also important, how I specified the path to the fonts in the styled-components package using createGlobalStyle.
Namely, when specifying an absolute path in html-pdf, it must end with "/" (note: " file:///mnt/c/Users/usrname/Documents/repository-f... "), and in createGlobalStyle the path must start with the name of the folder or file (the path is relative, relative to the specified folder in html-pdf), and not with "/" . Otherwise, even if the absolute one is without "/", and the relative one is with "/", fonts will not be loaded (and not only fonts, but everything that is taken from that folder).
Actually, that's all, it remains only to push the svg into PDF...
Upd.
After some time, it was decided to switch to puppeteer, since although html-pdf works, in general, as it should, it does not render html 1 in 1 like a browser, and as a result, one or another graphic bugs had to be fixed with crutches. Moreover, there was a problem with some inconsistency in the display of the width of some letters per pixel, which caused a very noticeable thickening of the letters in the PDF at a distance, but this could not be solved.
So, I didn’t succeed in pushing the fonts into the pupil, so I went the other way: I made 2 different ways for loading and for displaying the PDF, in the first one a page opens in the pupil and a “front” PDF is requested with everything that is needed.
Next, the page is converted to PDF with properly rendered html.
Separately, I note that I had to use Pupiter 1.18.0, in my opinion (or thereabouts), because in more recent versions Pupiter stubbornly returned an empty PDF.