javascript - vue.js和node.js前後端分離的項目，如何部署到Ubuntu伺服器

Question

專案是前後端分離的項目，客戶端的前端，管理系統的前端和後端(同時寫了客戶端和管理後台的API介面)的程式碼分別在三個資料夾中，對應三個github倉庫。
開發環境中: 我在3000埠開啟後端程式碼的伺服器，8080、8081分別開啟兩個前端程式碼的伺服器並分別跨網域到3000埠實現對介面的請求，進行開發。
在伺服器中該如何部署這樣的專案呢？我用的是pm2
我的預想是:
後端程式碼放在/www/backend/的資料夾中，設定nginx，讓介面可以透過url: 'api.xxx.com/... '訪問。
此時我的兩個前端專案該怎麼部署？前端專案是透過vue-cli建立的，可以分別透過npm build取得一個dist資料夾，其中包含index.html以及靜態檔案。在伺服器中也是分別建立兩個資料夾/www/frontend/、/www/manager/存放嗎？ nginx該如何設定才能存取這兩個前端專案中的index.html並且可以同時存取後端介面？是不是總共需要寫三個nginx設定檔？

Answer 1

兩個前端專案可以在多配置兩個server，listen不同的端口，一個nginx配置就可以。

補充

Answer 2

server {
  listen   8080;
  root /www/fontend;
  index index.html;

  server_name xxx.com www.xxx.com;

  location / {
    try_files $uri $uri/ /index.html;
  }

  location /api/ {
    proxy_redirect off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded $proxy_add_x_forwarded_for;
    proxy_pass http://127.0.0.1:3000/api/;
  }
}

前端的nginx配置可以參考這樣。

建議：
1、後端server只需要run到本地127.0.0.1
2、前端的nginx設定反向代理存取api介面
3、另一個前端專案參照上面的設定