I successfully implemented an error page following the documentation provided.
https://nuxtjs.org/docs/2.x/concepts/views#error-page
To achieve this, I created an error.vue file in the /layouts directory and assigned a custom layout to it.
<template>
<div>
<h1 v-if="error.statusCode === 404">Page not found</h1>
<h1 v-else>An error occurred</h1>
<NuxtLink to="/">Home page</NuxtLink>
</div>
</template>
<script>
export default {
props: ['error'],
layout: 'error' // custom layout
}
</script>
However, my project requirement is to have the 404 page in the /dist directory after running the generate command.
The desired structure should look like this:
dist/
--| 200.html
--| 404.html //currently missing in my setup
I have tried various solutions but they did not solve the issue:
- Simply adding a
404page to the/pagesdirectory still displays Nuxt's default error page.
If anyone knows of a concise way to address this problem, I would greatly appreciate your help. Thank you in advance!