#nextjs prerender build error

7 messages Ā· Page 1 of 1 (latest)

shrewd palm
#

Hello, I'm currently using the nextjs app directory, and when running my build command for nextjs i get a build error:

dashboard:build: info  - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules
dashboard:build:    Collecting page data ...
dashboard:build:    Generating static pages (0/4) ...
dashboard:build: Error occurred prerendering page "/_not-found". Read more: https://nextjs.org/docs/messages/prerender-error

I don't see anything wrong with my projects structure, as seen in the image below:

I am on the latest version of next "next": "^15.0.1",. Any clue what could be causing this?

I have a valid root layout:

import "@/styles/globals.css";
import { GeistSans } from "geist/font/sans";

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en" className={`${GeistSans.className}`}>
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <body>{children}</body>
    </html>
  );
}

and a valid (public)/page.ts:

export default async function Home() {
  return (
    <main>
      <div>
        <h1>hi</h1>
      </div>
    </main>
  );
}
lilac marshBOT
#

šŸ”Ž This post has been indexed in our web forum and will be seen by search engines so other users can find it outside Discord

šŸ•µļø Your user profile is private by default and won't be visible to users outside Discord, if you want to be visible in the web forum you can add the "Public Profile" role in id:customize

āœ… You can mark a message as the answer for your post with Right click -> Apps -> Mark Solution
(if you don't see the option, try refreshing Discord with Ctrl + R)

coarse ingot
shrewd palm
# coarse ingot there should be a more helpful error message above or below those log lines

Hi thank you for the response, there is some extra info, sorry. I have attached the entire error.

(public)/layout.tsx

export default function Layout({ children }: { children: React.ReactNode }) {
  return (
    <TRPCReactProvider>
      <main className="flex min-h-screen flex-col xl:p-0">
        <PublicNavBar />
        {children}
        <PublicFooter />
      </main>
    </TRPCReactProvider>
  );
}

(public)/page.tsx

export default async function Home() {
  return (
    <HydrateClient>
      <div className="h-full">
        <h1>hi</h1>
      </div>
    </HydrateClient>
  );
}

root layout.tsx:

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <html lang="en" className={`${GeistSans.className}`}>
      <meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <body>
        <ThemeProvider
          attribute="class"
          defaultTheme="dark"
          enableSystem
          disableTransitionOnChange
        >
          {children}
        </ThemeProvider>
      </body>
    </html>
  );
}

I have searched my code for the <HTML> component it says in the error and i do not use it anywhere. As far as I know, my layouts are also correctly formatted, im not duplicating the themeprovider/trpcprovider, and both layouts are server rendered on the server.

coarse ingot
shrewd palm
# coarse ingot is the repo open source? i need more info from this to determine the root cause ...

Hi, my repo isn't open source, but the issue persists in the default config of the T3 stack. https://create.t3.gg
trpc
tailwind
nextauth
prisma
postgres

When I get some time I could create a minimal reproducible example and upload it to a repo.

Also, thanks for the info about the usecontext issue, ill have a look into that šŸ™‚

Create T3 App

The best way to start a full-stack, typesafe Next.js app.