Custom error pages in Next.js 13 using the App Router. | Next.js | Page 1

vivid canyon May 9, 2023, 6:21 AM

#

Hello everyone, I have recently created a new Next.js 13 project, and cannot figure out the way to define a custom 404 page. I have tried defining both error.tsx and global-error.tsx files in the /app directory, however, nothing really seems to work. I still get the default 404 page which is built into Next.js. I believe I might be doing something wrong, but I don't really know what. I would greatly appreciate your help. Cheers.

#

P.S. I don't have anything complex in those error handler files. Here is what the contents of the files were:

/app/global-error.tsx

export default function GlobalError() { return "Error." }

/app/error.tsx

export default function Error() { return "Error." }

gilded condor May 9, 2023, 6:25 AM

#

I think its just 404.tsx

vivid canyon May 9, 2023, 6:25 AM

#

gilded condor I think its just 404.tsx

Really? I thought they deprecated.

#

Tried it just now. That didn't work either.

gilded condor May 9, 2023, 6:26 AM

#

O then try route-name/not-found.tsx

vivid canyon May 9, 2023, 6:27 AM

#

Wow, that worked, thank you. If possible, could you please link the documentation?

#Custom error pages in Next.js 13 using the App Router.