nginx多项目配置

单项目简单配置：

server {
    listen       8081;
    server_name  localhost;
    location / {
        root   /home/dataplatform/dist;
        try_files $uri $uri/ /index.html;
        index  index.html index.htm;
    }
    location /prod-api/{
        proxy_set_header Host $http_host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header REMOTE-HOST $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_pass http://localhost:8080/;
    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

多项目配置：

对于项目1而言，修改vue.config.js文件的publicPath

publicPath: '/vue1/'

对于项目2而言，修改vue.config.js文件的publicPath：

publicPath: '/vue2/'

分别在vue项目根目录中使用命令npm run build创建输出文件，将dist文件夹下的所有内容复制到nginx目录下的webapp/vue1和webapp/vue2内（没有的话自行创建）

修改nginx目录中的conf/nginx.conf文件，在 http -> server 节点中，修改location节的内容：

location /vue1 {
    root   webapp;
    index  index.html index.htm;
}

location /vue2 {
    root   webapp;
    index  index.html index.htm;
}

在nginx根目录使用命令nginx -s reload即可在浏览器中通过http://localhost/vue1、http://localhost/vue2访问项目1、项目2。