就是像 vue 這種框架，只要 npm run serve 他就可以自動產生 port 直接可訪問（本端開發時）
不需要透過 nginx 再另外設定
這是實際可以自己做的事嗎？還是安裝框架才會有的東西？

打開你的 package.json

你會看到

  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

npm run serve 就是跑上面的 serve

包括 laravel 也是直接 run 就可以產生 port 根本不需要透過 nginx

但是你不會想在 production 用 npm run serve 的

因為那個 server 只是 for dev

nginx 能做到的他基本上都沒有

以及 vue 在本端 npm run build 就會產生編譯後的 dist ，這個時候才可以丟在 nginx 上跑
甚至可以寫個腳本，當透過 git push 專案到 master 時，伺服器可以自己部署（跑 pm run build）！？

跨謀

感覺是想問 CI/CD

如果是想用 github

可以去玩玩 github action

參考

認真來說，只要是可以接受封包資料的任何一個應用程式。都可以拿來做web server。
nginx其中其中一個而已。

dragonH 就有提到，vue有自已的測試server可以啟用。
其實其它還有像是 Webpack Dev Server

講白的，那就是簡易式的server。跟用nginx、appche一樣的東西。
只是一般比較正式的server應用，會需要比較多的設定及調整。

而dev server其目的只是為了開發時方便。不需要調整有的沒有的東西。
啟用就好。

這對不太會架主機的人，是一個很方便的東西。還可以拿來當debug或是給編輯器使用。

我個人在使用上並沒有使用dev server。還是直接將程式放在nginx的run。
不過像是需要跑node的前端。就得另外處理了。(這又是另外一回事了)

1）可以了解一下 nuxt，如果想用 Vue 來做服務的話

2）依照你的構想，先拋開其他問題，的確是可以讓它跑 productoin 然後改用 80 port。但下一步，如果你要跑 https 呢？如果 server 上有其他服務已經先一步佔用了 80/443 port，那你要怎麼處理呢？讓 web server 去做這些事簡單、穩定也更強大。

3）我自己的經驗是可以用 Nginx 放在前面，然後 proxy 的方式指向 upsrteam (可參考 https://nuxtjs.org/faq/nginx-proxy/) ， 也就是 vue 跑起來的 server，這時它就可以任意指定未用過的 port，然後為了避免它掛掉，要用 pm2 去維持它的執行

4）至於自動部署的方式，我自己的做法是透過 commit 到特定 branch 時（testing、production），透過 web hook 去啟動編譯主機，從 git server 抓回更新、跑 npm run build 之後，再把 dist 的內容同步到正式或測試主機上。這個設計是因為 build 很耗資源，為了不影響主機的效能所以拆開來。