(Next 15 && next build) Error occurred prerendering page "/500".
Unanswered
gin posted this in #help-forum
ginOP
So recently i migrated to next 15, i did not change anything but now i keep getting this error (Error occurred prerendering page "/500".)
this happens on the first page it tries to prerender?
web:build: Collecting page data ...
web:build: Generating static pages (0/18) ...
web:build: Error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7B%24%24typeof%2C%20type%2C%20key%2C%20ref%2C%20props%7D for the full message or use the non-minified dev environment for full errors and additional helpful warnings.this happens on the first page it tries to prerender?
57 Replies
ginOP
now the thing is, reading cookies in the route will automatically switch to dynamic rerendering right?
i relied on this in next 14
but now it seems like this has changed?
callstack doesn't reference the source of the issue, only tells me the error
Brown bear
Visting that link in the error gives:
Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props}). If you meant to render a collection of children, use an array instead.which is the actual error that happened while building. Is your 500 page custom in any way, and if so, could you share the code?
ginOP
i dont have a 500 page
i only migrated to v15
i changed nothing
the things that was changed by the codemod is switchtig to async cookies and headers and useActionState
thats it
Brown bear
Do you have a custom
_error page? Either in pages router or app router. That would be the place it's coming from (either a custom one that is present, or the default one)ginOP
nope
the weird thing is
sometimes it happens in /500
sometimes in /404
im on ice
usually im the one helping lmao
and i need to get this project finished in 1 week
im cooked
Brown bear
Yeah, it's definitely in the error page, which renders for both.
no
global-error page either?Brown bear
are you using app router or pages?
ginOP
ill remove loading.tsx and try again
@Brown bear are you using app router or pages?
ginOP
app router
ofc
it has something to do with nextjs trying to prerender the route
even tho in my root layout i use cookies
so shouldnt that automatically switch to dynamic rendering?
ok now i forced nextjs to prerender my root layout dynamically
web:build: Generating static pages (0/8) ...
web:build: Generating static pages (2/8) the amout of static pages was reduced to the half and it stops on 2
then the same error but this time with /404
web:build: Error occurred prerendering page "/404". Read more: https://nextjs.org/docs/messages/prerender-error
web:build: Error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7B%24%24typeof%2C%20type%2C%20key%2C%20ref%2C%20props%7D for the full message or use the non-minified dev environment for full errors and additional helpful warnings.its just random
no i get the error on page 0/8
Brown bear
so, the
not-found.tsx will still render the outer layout.tsx. I'd look there. Additionally, the error mesage at that linkto reactjs.org is indicating that an object is trying to be rendered as a child. Something like <div>{ thisIsAnObject }</div>ginOP
what am i suppose to do with that?
isnt that how nextjs rsc works
i did that like idk 1000 times
in my code
Brown bear
That is erroneous only if what you're passing as a child is not a react component. It's perfectly valid if it is a component (a string, a component, an array of both, etc). The error your getting is because somewhere, something that is not a component is attempting to be rendered.
Like,
<div>{ "hello" }</div> is perfectly fine, but <div>{ { key: "value" } }</div> is not, because an object is not a valid react child.ginOP
u mean rendering a deeply nested json without parsing it to a string first?
if so thats really weird cause on v14 everything was working fine
i mean not only on v14 literally on every version
im not really sure its a problem on my side
so i probably will debug it further and if i dont get a solution ill head over to githu issues
Brown bear
It's probably some change in a value being passed somewhere. I'd read through and do everything in https://nextjs.org/docs/app/building-your-application/upgrading/version-15
If your project has any external react dependencies, check if there are any breaking changes in them. If you're using react 19, this may be difficult to find or unsupported for some of your dependencies, and you might need to fall back to react 18.
If your project has any external react dependencies, check if there are any breaking changes in them. If you're using react 19, this may be difficult to find or unsupported for some of your dependencies, and you might need to fall back to react 18.
Brown bear
Checking in, did you have any luck?
@Brown bear Checking in, did you have any luck?
ginOP
unfortunately not
i ended up reversing back to v14
for now
once i have time ill try to resolve this issue step by step
i have some libraries written by myself (i18n, auth etc) the issue could be in one of them so ill try to debug it once i have time