. Advertisement .
..3..
. Advertisement .
..4..
The error: “next/document should not be imported outside of pages/_document.js” is a common error that can show up in many ways. In this blog, we will go through some of the ways you can fix this issue. Read on.
How To Solve The Error: “next/document should not be imported outside of pages/_document.js”?
While creating the next.js, you might get the following issue.
next/document should not be imported outside of pages/_document.js. See https://nextjs.org/docs/messages/no-document-import-in-page.
There are two best methods for resolve the “next/document should not be imported outside of pages/_document.js” problem below
Approach 1: Upgrade Nextjs and eslint-config-next
Simply upgrade Nextjs and eslint-config-next to 11.1.3-canary.7, then clean cache using next lint –no-cache.
Approach 2: Simply remove document from your .eslintrc.json
If you don’t want nextjs to be updated, simply remove document from your .eslintrc.json file. Here’s how to do it.
"rules": {
"@next/next/no-document-import-in-page": "off"
}
Relevant knowledge of Next.js
Next.js is very much an all-in-one, full-stack modern app building tool. It provides first-class assistance of Typescript and React and offers simple solutions to certain of the most frequent needs in modern applications such as routing, API postCSS tools, code splitting.
It also supports static website generation (for super-fast static HTML pages which can be hosted anyplace) or managed hosting services such as Vercel/AWS/etc, which run on a Node server and can support fully on-demand data loading as well as rendering pages rendered by servers.
Next.js has rapidly become an increasingly demanded capabilities in the field of web development. This tutorial is designed to function as an “practical” addition to this documents and assist you in setting the project up using the best practices to increase the chances of ensuring everything is under in order as you grow.
Conclusion
We hope you enjoyed our article about the error. With this knowledge, we know that you can fix your error: “next/document should not be imported outside of pages/_document.js” quickly by following these steps! If you still have any other questions about fixing this syntax error, please leave a comment below. Thank you for reading!
Leave a comment