Nginx一个端口部署多个前端项目

场景

根据路由不一样，在一个端口中，配置多个前端vue项目。

配置

1. vue项目打包
   在vue.config.js中配置如下

   const isProduction = process.env.NODE_ENV === 'production'
   module.exports = {
         
         
     ....
     publicPath: isProduction ? './' : '/',
   }
   

2. nginx配置

   server {
       listen 8081;
       location / {
         root /opt/dist/vue3-element;
         index index.html;
       }
       location /base {
         alias  /opt/dist/base/;
         index  index.html index.html;
       }
   }
   

3. 访问

   http://127.0.0.1:8081/
   http://127.0.0.1:8081/base/