If the effect to be achieved is as follows
http://ip/vue => is the path to access the home page is usr/local/nginx/html/vue
http://ip/website => is the path to access the home page is usr/local/nginx/html/avue
2. Before packaging, add the following to the corresponding unpackaged file
The files in the vue directory are not added to the routing index.js file before packaging export default new Router({ mode: ' history ' , base : " /vue " //There is no "/" after this, and the 'root' is related to the different methods of nginx configuration routes: [ The files in the avue directory are not added to the routing index.js file before packaging export default new Router({ mode: 'history',
base: '/website/' //Add "/" after this, which is related to the different method configuration of nginx. Use "alias"
routes: [ The files in the html directory are not added to the routing index.js file before packaging export default new Router({ mode: 'history', routes: [
2. If the vue packaged file is placed under usr/local/nginx/html, the structure is as follows
html -vue -static -index.html -avue -static -index.html
-static
-index.html
3. The corresponding configuration of nginx
location /{
root html;
try_files $uri $uri/ / index.html; #Here to solve the problem that the page cannot be found after the route is refreshed
index index.html index.htm;
}
location / view{ root html; try_files $uri $uri / /vue/ index.html; #Here to solve the problem that the page cannot be found after the route is refreshed index index.html index.htm; } location /website { alias /usr/local/nginx/html/avue; try_files $uri $uri / /website/ index.html; #Here is to solve the problem that the page cannot be found after the route is refreshed
index index.html index.htm; autoindex on; }
4. When entering the first page, the corresponding js and css loading files cannot be found.
The easiest way here is to directly modify the index.html in the packaged fileas in the loaded file in vue / index.html <script type=text/javascript src=/static/js/app.39a70a1be7abbcb8f4c5.js></script> changed to <script type=text/javascript src= /vue/ static /js/app.39a70a1be7abbcb8f4c5.js></script>
For example: avue/index.html Also make corresponding modifications and add "/avue" in front of the path.
Of course, if the access is There is no path in front of http://ip/, of course, there is no need to modify it
This gives you access to three different vue projects
http://ip
http://ip/vue
http://ip/website