PDFViewer component in Next.js renders blank page when using custom fonts from local project

[aaqibrasool]

Describe the bug When attempting to use custom fonts from my local project in the PDFViewer component of react-pdf within a Next.js application, the rendered page appears blank with no content.

To Reproduce Steps to reproduce the behavior including code snippet (if applies): 1- Create a Next.js project. 2- Import and register a custom font from the local project using Font.register. 3- Apply the custom font to the PDFViewer component or any text element within it. 4- Render the PDFViewer component in a Next.js page. 5- Notice that the rendered page is blank with no visible content.

Expected behavior The PDFViewer component in the Next.js application should render the content with the applied custom font correctly, displaying the text using the specified font.

Screenshots

Desktop (please complete the following information):

• OS: Windows
• Browser chrome
• React-pdf version 3.1.9
• Next js 12.0.7
• React 17.0.2

[MGorgas]

I had the same issue. Updating nextjs to the latest version (13+) fixed this problem. See: next/font

[AMATEURTOSS]

is there any solution for this issue?

[thinhbg2812-2]

With next 14.0.1 i got same issue, the pdf load success but it's display blank