Custom 404 page handling with Nuxt 3 static + server routes

Support
,
1

I’m deploying a Nuxt 3 application to Netlify. It has pregenerated pages as well as server routes, that gets deployed as functions. I’m using the netlify nitro build preset.

Nuxt generates a 404.html, which i want to redirect to on 404’s.

Following to the docs i added this at the end of my _redirects file:

/* /404 404

But this results in the server-routes not working anymore and also throwing a 404.

The docs page states:

You can set up a custom 404 page for all paths that don’t resolve to a static file.

Well now, PLEASE don’t tell me i can’t have a custom 404 page and server routes working together!

2

You don’t need to add any redirects. Nuxt will itself add one to its server-side Function which will also handle the 404 page. Do you have a site to share?

3

Thanks a lot for your answer! I hav an app, that is fully prerendered, any only uses a handful of api-routes. Forwarding ALL non-static routes to the function means a LOT of unnecessary requests (bots, ddos, etc.) are hitting the function - causing unnecessary load on the function and higher bills.

But I’ve already found a workaround. It’s detailed here: Use static 404.html with server api-routes on Netlify · nitrojs/nitro · Discussion #3241 · GitHub