Resolve 404 error on Vue Routes on the Apache

After build of a VueJS application and config to run in Apache, is common return an 404 error when attempt access the routes.

This happens when the Vue Route uses the History Mode and the rewrite is not correctly configured.

Enable Apache 2 url rewrite and fix the 404 error in Vue

You need to configure your .htaccess file to rewrite all path urls to index.html.

Write a .htaccess at the Vue application root and paste the follow content:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>