[Solved]-How to import PDF file with react-file-viewer in Next.js?-Reactjs

Since your PDF file is located in the public folder, you can reference the image's path directly in the filePath prop.

You also need to make sure react-file-viewer is only imported in the browser as it depends on window being present to work properly. You can do so by dynamically importing the component through next/dynamic with ssr: false.

import dynamic from 'next/dynamic';

const FileViewer = dynamic(() => import('react-file-viewer'), {
    ssr: false
});

export default function Index() {
    return (
        <FileViewer fileType="pdf" filePath="/pdf.pdf" />
    );
};