Uncaught SyntaxError: Unexpected token '<' in pdf.worker.js

[NaveenkumarMD]

Before you start - checklist

• I followed instructions in documentation written for my React-PDF version
• I have checked if this bug is not already reported
• I have checked if an issue is not listed in Known issues
• If I have a problem with PDF rendering, I checked if my PDF renders properly in PDF.js demo

Description

got an error as Failed to load pdf in the screen and the "Uncaught SyntaxError: Unexpected token '<' in pdf.worker.js" in the console.

Steps to reproduce

• Install the package

            <Document 
                   file={require('../../Images/sample.pdf')}
                onLoadSuccess={onloadsuccess}
            >
                <Page pageNumber={pageNumber} />
            </Document>

Expected behavior

The pdf should be visible.

Actual behavior

The pdf is not rendered.

Additional information

No response

Environment

• Browser (if applicable):
• React-PDF version:
• React version:
• Webpack version (if applicable):

[Mitri45]

You have not mentioned what environment you are using, but assuming that you are using latest CRA application, which is using Webpack 5 under the hood, try to use different import for Document and Page components from react-pdf, like this:
import { Document, Page } from "react-pdf/dist/esm/entry.webpack";

Docs also provides other options of import paths, if you are using other bundler:

Bundler	Entry file
Parcel 1	react-pdf/dist/esm/entry.parcel
Parcel 2	react-pdf/dist/esm/entry.parcel2
Webpack 4	react-pdf/dist/esm/entry.webpack
Webpack 5	react-pdf/dist/esm/entry.webpack5

[markivancho]

I could not reproduce it on my end, but our error tracking tool caught the similar error
I've recently switched to CRA-5 with React 18 and react-pdf/dist/esm/entry.webpack5

[wojtekmaj]

Duplicate of #97
See also #991, #680 and others.

[spogulis]

This worked but console throws a warning regarding source map:

DevTools failed to load source map: Could not parse content for http://127.0.0.1:8000/pdf.worker.js.map: Unexpected token < in JSON at position 0