Menu
I am getting this error during build time because of Next.js custom document.
So, during the build time I am getting an error saying, Also I have the _document.js in pages/_document.js.
next/document should not be imported outside of pages/_document.js. See https://nextjs.org/docs/messages/no-document-import-in-page.
Please help me!
EDIT
Update next and eslint-config-next to version 11.1.3-canary.7
795
next/document was imported in a page outside of pages/_document.js (or pages/_document.tsx if you are using TypeScript). This can cause unexpected issues in your application. Only import and use next/document within pages/_document.js (or pages/_document.tsx) to override the default Document component:
next/document was imported in a page outside of pages/_document.js (or pages/_document.tsx if you are using TypeScript). This can cause unexpected issues in your application.
Since nextjs uses reactjs we can use the useEffect hook which checks if component has mounted or updated. Here is an example. Note that I passed [] as a second argument, this is because useEffect watches what has changed which in this case I just want to check if the document has completed loading.
I came across this error while learning next js and I couldn't understand what I did wrong. The error is thrown because document is only available inside the browser and not on the server. Next js executes this code on the server side and that's why the error is thrown.
A known issue that is fixed in #28596
If you don't want to update to the canary versions and still keep working normally just exclude it from your .eslintrc.json rules:
"rules": {
"@next/next/no-document-import-in-page": "off"
}
More info on how to exclude rules here: disabling-rules
107
Quote from Nextjs team:
This is fixed in #28745 and works in 11.1.3-canary.7. Please upgrade to that version if you're experiencing this issue and if you're still seeing the same error, make sure to clear your cache (next lint --no-cache).
You need to update Nextjs and eslint-config-next to 11.1.3-canary.7 and don't forget to clear cache next lint --no-cache
36
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
