We have a WordPress website, and one of the pages contains a Vue SPA ( /admin ). Everything works correctly unless you try to go directly to one of the routes within the SPA ( /admin/billing ). This gives a 404 error, since the page doesn't actually exist.
How can I keep the default WordPress routing for all pages except /admin, and have Vue Router handle the routing correctly when e.g. /admin/billing is loaded? I'm not super well versed with .htaccess, but I've spent a good amount of time researching this and have tried a number solutions. Any help would be greatly appreciated!
Here are a few solutions I've tried:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !^/admin/(.+)
RewriteRule . /index.php [L]
</IfModule><IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^admin.* admin/index.php [L]
RewriteRule . /index.php [L]
</IfModule><IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /admin
RewriteRule ^admin/index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /admin/index.php [L]
</IfModule>