如何把vue-router和express專案部署到伺服器上去

下面我就為大家分享一篇把vue-router和express專案部署到伺服器的方法，具有很好的參考價值，希望對大家有幫助。

- 首先確定此項目在本地能夠運行成功

在本地命令列中輸入npm run start，無報錯，且打開127.0.0.1:3000

有寫的路由為/的頁面，如圖

此為檔案層級關係

front為前端檔案

xk3為後台express與資料庫mysql連結的檔案

用命令列進入後台並且運行，啟動成功

這是路徑為/的頁面

在瀏覽器中輸入路徑http://localhost:3000/

瀏覽器中顯示WelCome to express

至此此項目在本地運行成功，我們現在就要放到伺服器上。

- 準備工作

先前伺服器的基本設定就不再贅述。

開啟xftp或其他類似軟體，將此專案全部複製到/var/www/路徑下

（此路徑可能會不一樣，就是伺服器網頁的路徑）

將後台所需的資料匯入伺服器的資料庫中，指令為mysql>source 「路徑」;

然後開啟xshell並進入此專案後台，類似於在本地運行後台文件，前提是你的伺服器上安裝了node,mysql等基本配置，自行百度，還有一個問題就是確定你的vue-router中的路由獲取的是伺服器的ip port router,例如var url = 'http://47.95.7.109:3000/course/batchDelete'，也要從阿里雲的安全群組配置那裡打開你的3000端口，不然訪問會被阻止。

我的運行失敗是因為我之後用了forever守護進程，一直在佔用3000端口，所以無法啟動，如果沒有設置過的話能夠正常啟動就和在本地一樣。

以我的學生選課系統為例截圖

#但是這樣你的伺服器就一直處於阻塞狀態，只要斷開鏈接，服務也會中斷。

建立守護程式

接下來就是用pm2或是forever建立守護進程，經過親測，感覺forever比較簡單，只需要幾行命令，並不需要額外配置。

即開始使用forever

1.sudo npm install forever -g

2.forever start app.js

#3.forever start -l forever.log app.js

#這是我出現了一個錯誤,是沒有指定錯誤和輸出的日誌檔案

提示錯誤為：log file /root/.forever/forever.log exists. Use the -a or –append option to append log.

4.解決方案

forever start -a -l forever.log -o out.log -e err.log app.js(app.js就是後台的入口檔)

##如果還是不行可使用

forever start -a -l forever.log -o out.log -e err.log ./bin/www

此時node專案部署完成，就算關閉伺服器的後台服務也能正常運作，不需要阻塞。

運行成功圖片

如果其中有問題，請提出，謝謝！

範本連結：http://47.95.7.109/student/work/front/#/

上面是我整理給大家的，希望今後對大家有幫助。

相關文章：

透過Angular利用內容投射向元件輸入ngForOf範本的方法步驟有哪些？

vue專案中打包後透過百度的BAE發佈到網路上的流程步驟有哪些？

在Angular中@HostBinding()和@HostListener()用法（詳細教學）

以上是如何把vue-router和express專案部署到伺服器上去的詳細內容。更多資訊請關注PHP中文網其他相關文章！