Does it work with build/generate?

[renatocf]

Hi,

First of all, thanks for this great module. It really simplified the task of redirecting routes with Nuxt!

I'm just having a little problem with it: I generated a static page with nuxt generate and deployed it to Netlify. I tried to redirect the base route / to another route /something, but it didn't work. I receive a "page not found" from Netlify. I also tried to make a production SPA with nuxt build but the same happens. In development mode, however, everything works fines. Does the library handles the SPA / static mode or does it rely on Nuxt's universal mode (with a server) to run?

Thanks for your help!

[renatocf]

This is my project's repository (open source at GitLab):
https://gitlab.com/uspcodelab/sites/hackathonusp

Here it's the deploy at Netlify (the website is in Portuguese, but I think that the content is not relevant for the problem):

• The main page: https://hackathonusp.netlify.com/2018.1
• The broken redirect: https://hackathonusp.netlify.com/

The module is configured in the nuxt.config.js with the following line:

redirect: [{ from: "^/$", to: "/2018.1" }],

[manniL]

Hey @renatocf!

Unfortunately, the redirect-module only works in universal mode ☹️. The technical reason is that redirects are realized through a server middleware, which can only react when there is a server running. This is only the case in universal/SSR mode.

Will add this to the README asap!

Maybe we could leverage the vue-router alias/redirect function to make redirects working in SPA and generate mode 🤔
But I'm not sure how SEO-optimized this solution would be, keeping status codes and duplicated content in mind 🤔

[manniL]

Though I'm not sure if vue-router will help when using generate mode. Maybe it'd be best to setup the redirects on netlify (or your server/service settings) directly

[renatocf]

@manniL, after some time I found [this issue](I ended up following this issue: nuxt/nuxt#1843) from Nuxt's main repository that helped me solve my case.

I used the redirect command in the <script> section of the pagens/index.vue page. So whenever someone hits the main route /, it gets redirected to the proper page. I hope others may find this solution useful in the future.

[Aztriltus]

@manniL for universal NuxtJS apps, setting up Netlify redirect doesn't work since it is kind of an SPA. So the only redirect that works is /* to /index.html 200. If you write any other redirects before this, such as /events/* to /events 301, navigating to a non-existent page /events/abc will bring up the Netlify error page (instead of NuxtJS error page).

So the next solution I tried was this redirect-module but because I use Nuxt generate, the middleware provided by the module didn't work as mentioned.

However, there is a way to get redirect working on NuxtJS with a SSR site (Nuxt generate). See my solution below:

1. Create error.vue in /layouts
2. Configure the layout method like so

<template><!-- your error page template here --></template>

export default {
  layout({ redirect, route }) {
    if (route.path.match(/^\/events\/(.*)$/)) redirect(301, '/events')
    return 'layout'
  },
  props: ['error'],
}

What this does is simple, if Nuxt determines that the route path is not found, instead of showing the error page, we check the route path in layout(context) method and redirect all the dead links accordingly there. Finally, we return 'layout' or any other layout files you have to display your error message if none of the route path matches.

One problem with this solution is that it's not done before loading the page, so the page may load path '/' first (because of Netlify redirect), before redirecting to the correct page determined in layout(context) found in error.vue.

I'm using this specific solution because I re-developed a website in NuxtJS and I wasn't keeping to the old route paths. Moreover, some old links were used in media and other websites so it wouldn't be nice to show an error page saying the page doesn't exist. But since I'm using Nuxt generate, I'm willing to live with this solution for now until there is something better. Hope this helps someone out there!