Nuxt generate error page
I currently use prerendering all pages and upload them to s3. Hot should the error page be handeled when doing this? I have an error.vue file that fetches the content for this page, but it is not prerendered
14 Replies
yes, that's how it goes. An "SPA-like" fallback that is pre-rendered but without content and generates it on demand
should be 200.html or 404.html by default
@manniL / TheAlexLichter Yes but the content of the page is not prerendered therefore empty. I tried to prerender it by making a custom route:
routes.push({
name:
error
,
path: '/error',
file: '~/error.vue',
});
This works in theorie - but now the browser url is rewritten to /error
when i get an 404. Is it possible to disable this?that is correct. See https://github.com/nuxt/nuxt/issues/18718
GitHub
support prerendering error pages · Issue #18718 · nuxt/nuxt
Describe the feature Use case: Trying to use Nuxt3 as a static site generator, in combination with a headless CMS. Setup: error.vue in project root, shared navbar/footer in layout/default.vue (wher...
So there is currently no way to prevent the url rewrite right?
@manniL / TheAlexLichter
you could define an own [...slug].vue which can act as catch-all. But more or less the same problem.
Are you in need of a static error page?
Yes, this page is used as a fallback for a static page hosted in the aws s3. In general, it works now, but the URL rewrite is kind of ugly.
But you definitely can’t use a dynamically generated one?
better would be a prerendered one to prevent the API delay
@manniL / TheAlexLichter In general the behavior is strange if I use the
404.html
directly.
I linked now the 404.html as fallback: https://www.wenatex.com/de/de/asdasdasd - but it seems it does not use the logic in the error.vue
file, but uses pages/[...slug].vue
which is my default pagebuilder site does not load any content.
If I call it directly it works: https://wenatex-website.s3.eu-central-1.amazonaws.com/404.html - but takes a lot of time
And this would be my custom prerendered error page, but there the path is changed to /error as soon as the page is loaded: https://wenatex-website.s3.eu-central-1.amazonaws.com/error-page.html
So all options are not really good 😅oh well, if you have a [...slug].vue, you have to deal with handling the errors "on your own" (e.g. throw a fatal one there if the API call didn't succeed)
Because the catch-all matches all the routes then
alright thanks for all the help - maybe in the future there will be a way to prerender the error page, or to disable the url rewrite "feature".
I mean, the rewrite is caused because you defined it.
You can through a fatal error in your
...slug.vue
for a more dynamic handling but the error page will always be an SPA fallback as that logic has to be executed somewhere if there is no "static file" matching the route
so let's say you enter /users/1 -> /users/1/index.html will be used
but /users/jawiodjaosif might not have a static file prerendered. Now the fallback file will be used, which is SPA-style, so it could do anything ,e.g.
* It could show another user which wasn't prerendered
* The fallback could show a 404 page
* The fallback could show something totally different based on your logicSure this makes sense for a lot of cases. But if I generate everything and I want to always show my predefined 404 page if the file is not found in my file storage it would be nice to have the option to define a prerendered page for that
yes, absolutely! That's why the issue is there!
One manual workaround would be emitting your own custom 404.html but it wouldn't be an SPA then