"ReferenceError: window is not defined" in next js when using react-draft-wysiwyg?
I am trying to create a next.js application. But when I import and use Editor from 'react-draft-wysiwyg', I get an error saying that <strong>"ReferenceError: window is not defined". </strong> My import statement looks like "import Editor from 'react-draft-wysiwyg';" How do I solve this?
1 Answer
Yes in next js you have to import the "react-draft-wysiwyg" dynamically. Basically what is happening is that when the module loads the windows object is not defined. So what you need do is import the react-draft-wysiwyg when windows object is available. To achieve this please use the below code. <code>import dynamic from 'next/dynamic'; const Editor = dynamic( () => import('react-draft-wysiwyg').then(mod => mod.Editor), { ssr: false } ) import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";</code> <strong>Please use the above code to solve "ReferenceError: window is not defined" in next js</strong>
saam