I have Craft set up to serve a single page Vue App (vue-cli) for all routes it can't match in the sections.

return [
  '<url:(?!api).*>' => ['template' => 'index'],

This works perfectly.

However, I was hoping I could also use a Redirect manager plugin like Retour, Redirect Manager or Sprout Redirects.

I tried them all but they only take effect when I disable the routing rule.

How could I have both working together?

2 Answers 2


The way Retour works, it doesn't do anything until Craft throws a 404 error. Some other plugins do this as well.

Your route is such that anything Craft can't find goes to your SPA; that means Craft never throws a 404, so these tools will not do anything.

What I'd suggest doing is have this redirect happen via your web server.


I ended up making a 404 template (which in atuality is the SPA index file)

This causes the Craft redirects to take effect, and have the SPA as a fallback route.

This means in Production i don't need any such route. For development purposes i do, so i made a conditional route file (to avoid the debug 404 of Craft):

 if(getenv('ENVIRONMENT') === 'dev') {
   return [
     '<url:(?!api).*>' => ['template' => '404']
 } else {
   return [];

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.