NextJS 15 Build Error occurred prerendering page "/404"

Question

when running NODE_ENV=developement npm run build in nextjs project, there is the following error,

Error: should not be import outside of pages/_document. Read more: https://nextjs.org/docs/messages/no-document-import-in-page at y (D:....next\server\chunks\7627.js:6:1263) An error occurred while pre-rendering the page "/404". Read more: https://nextjs.org/docs/messages/prerender-error Error: should not be import outside of pages/_document. Read more: https://nextjs.org/docs/messages/no-document-import-in-page in Y (D:...\node_modules\next\dist\compiled\next-server\pages.runtime.prod.js:16:5469) in y (D:....next\server\chunks\7627.js:6:1263) in react-stack-bottom-frame (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:8798:18) in renderWithHooks (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:4722:19) in renderElement (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:5157:23) in retryNode (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:5805:22) in renderNodeDestructive (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:5631:11) in renderElement (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:5143:11) in retryNode (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:5805:22) in renderNodeDestructive (D:...\node_modules\react-dom\cjs\react-dom-server.edge.development.js:5631:11) Export encountered an error at /_error: /404, exiting the build process. ⨯ Next.js build worker exited with code: 1 and signal: null

I didn't create a custom 404 page. Please help.

NextJS 15.1.7, React 19.0.0, tailwindcss 4.0.7, DaisyUI 5.0.0, Prisma 6.4.1

you should share conf as well and the thing that caused it ... at first does it working or not ?? at what point you get that error ? plz post clear questions and cause. — root_coding
– root_coding, Commented Mar 4 at 5:00
I just use the default config, just empty one, in next.config.ts, import type { NextConfig } from "next"; const nextConfig: NextConfig = { /* config options here */ }; export default nextConfig; at first it worked, but suddenly, after a while I added some code, when I wanted to build it didn't work, but if I run dev it worked — fauzancodes
– fauzancodes, Commented Mar 4 at 7:39

Walter Chapilliquen - wZVanG · Accepted Answer · 2025-03-04 05:05:00Z

3

The error indicates an incorrect import from next/document outside of pages/_document.js.

Try:

Search your code for any imports from next/document (especially near components related to the 404 page)
Replace import { Head } from 'next/document' with import Head from 'next/head' if you're using it for metadata in regular pages
Make sure you only use components from next/document in the pages/_document.js file

The problem is likely in a shared component that's being used across multiple pages, including the 404 route.

answered Mar 4 at 5:05

Walter Chapilliquen - wZVanG

12.1k8 gold badges44 silver badges64 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

fauzancodes Mar 4 at 7:41

no, i didn't import next/document at all. and there is no pages/_document.js, because i am using app router

Hari Kurniadi · Accepted Answer · 2025-10-20 07:54:14Z

0

If you notice in layout.js, all components must be inside HTML tags, for example:

export default function RootLayout({ children }) {
return (
<html lang="en" className={`${Manrope.className} antialiased`}>
<body suppressHydrationWarning={true}>
<OnlineStatusProvider>
<StoreProvider>
<AntdRegistry>
<Useidlelogout />
<YearDataProvider>
{children}
</YearDataProvider>
</AntdRegistry>
</StoreProvider>
<StatusIndicator />
</OnlineStatusProvider>
</body>
</html>
);
}

answered Oct 20 at 7:54

Hari Kurniadi

1

Comments

teddzyb · Accepted Answer · 2025-10-20 10:34:23Z

I think you may be importing components or utilities that are specifically designed for use only within Next.js's custom document file into one of your regular pages.

For example, you may be importing something that comes from next/document like import { Html, Head, Main, NextScript } from "next/document";. In that case, the correct way to do would be import Head from "next/head";.

Since you mentioned that you didn't import next/document anywhere at all, it could be from a third-party library utility or component.

Here's what I suggest you do to debug:

Search your entire project folder for the string "next/document" and "next/dist/pages/_document".
Temporarily comment out imports in files such as _app.tsx, next.config.js, etc.
Temporarily comment out wrappers you are using in your _app.tsx such as <PrismaProvider>, <Layout>, etc.
Temporarily disable DaisyUI by commenting out the DaisyUI plugin in your tailwind.config.js.

I hope this will help you identify or narrow down the specific problem.

Collectives™ on Stack Overflow

NextJS 15 Build Error occurred prerendering page "/404"

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related