DEV Community

Cover image for Resolve 404 error on Vue Routes on the Apache
Wallace Maxters
Wallace Maxters

Posted on • Originally published at wallacemaxters.com.br

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.
Error 404 on Apache 2 Vue route

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>
Enter fullscreen mode Exit fullscreen mode

Discussion (0)