vue-router url paths are giving a 404 in production with nodejs-CodePudding

I am attempting to deploy a multipage vue3 frontend to an application. It works fine in development mode, but in production, when I attempt to navigate to a url via the search bar -- e.g. https://mywebsite.com/customers, I get a 404.

I am able to fix this by redirecting to the homepage using the suggestion on vue-router's documentation, but then it just goes to the homepage rather than showing the actual page I would like to visit. Is there some way around this that I am missing? An additional step or does this suggest I am misconfiguring this somehow?

CodePudding user response：

I solved this by setting up the server. You need to understand what server you have installed. Go to config update and restart the server.

Here are the Server Configurations

Apache

<IfModule mod_negotiation.c>
  Options -MultiViews
</IfModule>

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

nginx

location / {
  try_files $uri $uri/ /index.html;
}