Após fazer o build de uma aplicação escrita no VueJS e configurá-la para rodar no Apache, é comum ocorrer um erro 404 ao tentar acessar as rotas da mesma, ou a pádina em branco.
Isso ocorre geralmente porque o Vue Route utiliza o History Mode. Ao tentar acessar as urls pelos link da aplicação, a navegação ocorre normalmente. Porém, ao acessar diretamente pela barra de navegação ou ao tentar atualizar a página, ocorre o erro 404.
Você precisa configurar a reescrita de URL no Apache 2 apontando qualquer path da url para o arquivo index.html.
Primeira opção: Na raiz do projeto crie um arquivo com nome vue.config.js e adicione as linhas module.esports = { publicPath: ‘nome-da-pasta‘}
Você deve criar um arquivo .htaccess na raiz do projeto, com o seguinte conteúdo.
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
ou outra opção seria
RewriteEngine On
RewriteBase /nome-da-pasta
RewriteRule ^nome-da-pasta/index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /nome-da-pasta/index.html [L]
Deixe um comentário