docker部署vue项目，复用同域名转发不同vue项目

一、前端项目转发

1. 前置条件：
   a、公网域名为：A ，A可以是默认绑定 V1或者是一个独立的Nginx；
   b、现有vue项目 V1 和V2，两者均为docker容器运行；

2. 需求：http://A/V2 访问到V2服务

3. A绑定的nginx追加配置：

 location ^~/V2/ {
       proxy_pass  http://A;
		   proxy_set_header Host $proxy_host;
		   proxy_set_header X-Real-IP $remote_addr;
		   proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
         }

注意：proxy_pass A域名后未带/，
3.1、不带/则携带前缀V2转发到目的服务，如：http://127.0.0.1:80/V2/test=>http://127.0.0.1:80/V2/test
3.2、带/则去除前缀V2转发到目的服务，如：http://127.0.0.1:80/V2/test=>http://127.0.0.1:80/test

4. V2的nginx追加配置：

   location /V2 {
        alias /usr/share/nginx/html;
        index index.html;
       try_files $uri $uri/ /index.html last;
    }

注意：alias 后跟着的路径为你的前端dist文件存放位置，因为我是docker部署，所以直接看dockerFile copy的路径即可
彩蛋：对于V2服务本身则支持 ip:prot或者ip:port/V2兼容访问

5. V2服务的vue配置

   5.1 vue.config.js 静态资源配置

代码如下（示例）：

 module.exports = {
  publicPath: '/V2',
 }
 

5.2 更改router模式，添加前缀

位置：router文件夹下面的index.js

const router = new Router({
  base: '/V2', // 路由前缀
  mode: 'history', 
  // 采用history模式URL的路径才跟配置的对应上，不然URL是先加/#再追加配置的地
  routes:[...]
  });