vue-router's default data hash pattern - uses the hash of the url to simulate a complete URL, so when the URL changes, the page will not reload.
Generally speaking, we don’t like ugly hash, which is similar to #/matchResult, and can use the history mode of the routing. The history mode uses API to implement page redirection.
But there is a problem. When using nginx, we need to add some configuration.
Configure directly in the root path
It is directly configured in the root path. Only input is used when accessing. The configuration in nginx is as follows
location / { try_files $uri $uri/ /; }
Non-root path configuration
If there are multiple projects under a domain name, then using the root path configuration is not appropriate. We need to specify a layer of path under the root path, for example
Project A
/A
Project B
/B
nginx configuration
location ^~/A { alias /XX/A;//This is the path of A index ; try_files $uri $uri/ /A/; } location ^~/B { alias /XX/B;//This is the path of B index ; try_files $uri $uri/ /B/; }
tip: Note that you should use alias, not root
The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.