Nuxt.js: Auto Redirection to 404 not working with SSR

[raza2022]

Version

v2.0.0

Reproduction link

https://www.tradebakerz.com

Steps to reproduce

Start new Project with nuxt package (v2.0.0)
create one default layout
create one two component
create one two pages
run npm run generate
now go in generated dist and server with any http server i.e https://www.npmjs.com/package/http-server
now when you go to any route which is not defined it will just throw error in console instead of redirection to 404
i.e go to localhost:8080/dummyurl
it will not redirect to 404 instead of just throw warning in browser

What is expected ?

I want to redirect the below routes to custom or at least default 404 page :(
https://www.tradebakerz.com/test
https://www.tradebakerz.com////

What is actually happening?

it will not redirect to 404 instead of just throw warning in browser
i.e
https://www.tradebakerz.com/test
https://www.tradebakerz.com////

Additional comments?

1. I tried with below lines in nuxt.config but no luck
   generate: { routes: ['404'] }
   but no luck

2. I tried to extend router to go all invalid path to 404 by creating a 404.vue page in pages and adding below code in nuxt.config

router: { extendRoutes (routes, resolve) { routes.push({ name: 'custom', path: '*', component: resolve(__dirname, 'pages/404.vue') }) // routes.push({ path: "*", component: 'PageNotFound' }) } }
but no luck any help will be greately appricated and bunch of thanks in advance

_{This bug report is available on Nuxt community (#c8397)}

[raza2022]

@Atinux @pi0 @clarkdo @manniL I think I came here in holiday session :+1:
but what about @renovate-bot , are you also on holiday :(

[manniL]

You can set generate.fallback to true to achieve the desired behavior ☺️

More info: https://nuxtjs.org/guide/routing#implementation-for-github-pages-and-netlify

Example (in prod): https://lichter.io/aaa

[raza2022]

@manniL :+1: I can't believe I missed fallback option. I almost go through generate properties few time from top to bottom (now feeling stupid), however my question consists two slimier issues
how do you achieve /// in url as I can see when I hit https://lichter.io/// then it's automatically redirect to https://lichter.io but not in my case
https://www.tradebakerz.com///

[manniL]

@raza2022 That's something you have to set up in your Reverse Proxy (or use a service like Netlify) ☺️

[raza2022]

please note I didn't resolved both issue on server but 404 resolved in local environment so I believe that it might related to nginx server which I am using on server. I just started with nuxt can you point me any good example of nuxt with nginx code example. anyways Thanks man for prompt help :1st_place_medal:

[manniL]

You are welcome! ☺️

I know there is a config example @ https://nuxtjs.org/faq/nginx-proxy#using-nginx-as-a-reverse-proxy

Hope that fits your needs :)