Nuxt 404 Error Page Should Redirect To Homepage

- 1 answer

I am looking for a way to always redirect to homepage when a page doesn't exist using Nuxt.Js.

Our sitemap generation had some problems a few days back and we submitted wrong urls that do not exist. Google Search Console shows a big number of 404 and we want to fix them with 301 redirect to homepage.

I tried this

created() {
        name: 'index',
        query: {
          e: 'er'

and although the page redirects to homepage successfully I think Google will have problems with this since the pages initially renders with 404.

I also tried this

  async asyncData({ redirect }) {
    return redirect(301, '/el?e=rnf')

but didn't work (same with fetch)

Any ideas on a solution to this?



You are able to create a default 404-page in nuxt - just put a file with a name _.vue in your ~/pages/ dir. This is your 404-page :)

or you can use another method to create such page: but I have not tried it

Then add a simple 404-redirect-middleware to this page:

// !!! not tested this code !!!
middleware: [
  function({ redirect }) {
    return redirect(301, '/el?e=rnf')