addRoutes redirect changes the url but does not load the page

[ynnelson]

• [ x] I confirm that this is an issue rather than a question.

Bug report

Steps to reproduce

enhanceApp.js

export default ({
  Vue, // the version of Vue being used in the VuePress app
  options, // the options for the root Vue instance
  router, // the router instance for the app
  siteData // site metadata
}) => {

  router.addRoutes([
    {
      name:"emailSubscription",
      path:"/views*",
      redirect: to => {
          return to.params.pathMatch //This would output "/dashboards"
         },
    }
  ])
}

What is expected?

When I enter url http://mywebsite.com/views/dashboards I should be redirected to http://mywebsite.com/dashboards. In my config file /dashboards is defined and points to a README.md file.

What is actually happening?

In dev the redirect works like a charm, no problem. When I vuepress build the site the URL gets rewritten, meaning in the browser the URL physically changes but the page always lands on the front page and the appropriate page and components do not load. The redirect does not occur...

Other relevant information

I tried using router.BeforeResolve instead by putting a rewrite rule there for the URL but to no avail, I cannot get URLs to redirect properly.
Also I noticed that after the redirect rewrite the URL but does not load the page any other link on the app I click give me the following error:

I don't even know where to begin with this error... I cannot find any useful information anywhere.

• Output of npx vuepress info in my VuePress project:

Environment Info:
System:
OS: macOS 10.14
CPU: (4) x64 Intel(R) Core(TM) i7-7567U CPU @ 3.50GHz
Binaries:
Node: 8.10.0 - /var/folders/1d/8krd2vl11v353f787zrj3chr0000gn/T/yarn--1566860988277-0.30996437124819876/node
Yarn: 1.17.3 - /var/folders/1d/8krd2vl11v353f787zrj3chr0000gn/T/yarn--1566860988277-0.30996437124819876/yarn
npm: 6.10.3 - /usr/local/bin/npm
Browsers:
Chrome: 76.0.3809.100
Firefox: Not Found
Safari: 12.0
npmPackages:
@vuepress/core: 1.0.0-alpha.48
@vuepress/theme-default: 1.0.0-alpha.48
vuepress: ^1.0.0-alpha.47 => 1.0.0-alpha.48
npmGlobalPackages:
vuepress: Not Found

[m-mohr]

This is really annoying as it breaks a lot of links after the migration. I though it works and deployed, but now all my redirects are not working and users are stuck with a 404 (in my case). Is there any workaround? Please fix asap. Let me know whether I can help with anything.

[saragee3]

I'm having the same issue. The url is correct, but redirects to a 404. If i press into the browser and press enter with that url, a page will load.

[saragee3]

(Update) Feels hacky, but can't get pass the SSR mismatch:

enhanceApp.js

export default ({ router }) => {
  router.beforeResolve((to, from, next) => {
    const toReroute = [
      '/relative/path`
    ];

    let flag = toReroute.filter(i => to.fullPath.startsWith(i))
    if (flag.length > 0) {
      window.location.href = flag[0];
    } else {
      next();
    }
  });
};

[just-at-uber]

I tweaked your solution @saragee3 with a more generic approach. Basically there is an issue with the redirection code in vuepress/vue router

export default ({ router }) => {
  router.beforeResolve((to, _from, next) => {
    const browserWindow = typeof window !== "undefined" ? window : null;
    if (browserWindow && to.matched.length && to.matched[0].path !== '*' && to.redirectedFrom) {
      browserWindow.location.href = to.fullPath;
    } else {
      next();
    }
  });
};

because of SSR, we need to do an undefined check on window, otherwise the code doesn't compile. We only do the redirect if there is a redirectedFrom attribute. The path matching is there to check if the route was detected or not (if it truly should go to 404 or to a page). Until vuepress has an official way to redirect correctly, this should work for most peoples cases.

Thanks!