error.js
Unanswered
Greenland Dog posted this in #help-forum
Greenland DogOP
My error.js file within route segment not working anymore. I see the default Next.js crash screen instead of fallback Page. File content is as described in Next.js 13 App Router documentation. I already deleted .next folder to get rid of cache. Any other idea?
'use client' // Error components must be Client Components
import { useEffect } from 'react'
export default function Error({ error, reset }) {
useEffect(() => {
// Log the error to an error reporting service
console.error(error)
}, [error])
return (
<div>
<h2>Something went wrong!</h2>
<button
onClick={
// Attempt to recover by trying to re-render the segment
() => reset()
}
>
Try again
</button>
</div>
)
}7 Replies
what does your project structure look like?
Greenland DogOP
Here it is. Thanks ✌ï¸
I've been experimenting with this for the past couple of hours and I found some weird buggy behaviours. Long story short, you'll probably have to use React's way of catching errors and building error boundaries with the help of a package like
react-error-boundary without relying too much on error.js for the time being...I'll post here an example of how you could do it with your current setup tomorrow since rn it's bedtime where I live 🤣
Greenland DogOP
Thanks dude. I got the issue, apparently Errors thrown inside event handler are not working in React. I was throwing the Error inside a onClick handler, therefore it doesn't work. You can use a state to track the error inside the component however. That's the way 😉 Here is the official issue in Next.js github page:
https://github.com/vercel/next.js/issues/42525
https://github.com/vercel/next.js/issues/42525
Yeah, there's that too 

Btw, I ended up building that demo anyways
Here's the repo: https://github.com/milovangudelj/tests
And here's the deployed version: https://tests.milovangudelj.com/
There's still an issue with
Here's the repo: https://github.com/milovangudelj/tests
And here's the deployed version: https://tests.milovangudelj.com/
There's still an issue with
global-error.tsx but for that I'll need to open a new GitHub issue if someone hasn't done it already.