上傳文件至云服務器

一、打包文件

在項目根目錄下運行

npm run build

等待命令運行結束后，會發現目錄下多了 dist 文件夾，這個文件夾就是我們等下要放到服務器中的。

二、文件傳輸

打開 Xftp與實例建立連接

云服務器Apache默認的根目錄是/var/www/html，因此我們在這個目錄下新建music文件夾（這里以我的項目文件名為例）

將項目本地的dist文件夾的內容移到云服務器music文件夾下（準備好前端資源）

將項目本地的server文件夾也移到云服務器dist文件夾下（這里注意不要復制node_modules文件夾）

補充當時后臺代碼路徑：C:\try\Vue-mmPlayer-master\dist

這里再補充一個項目：
電商后臺管理項目：http://arwin521.top/vue/

這里將本地dist文件夾中的內容，放在了vue文件夾內，若直接將dist文件夾拖到vue路徑下，則會報錯

報這樣的錯實在是太愚蠢了 😦

三、初始化項目

① 輸入以下兩行代碼進入項目

ls指令后下面會顯示該目錄下的文件夾

② 上傳 package.json到服務器目錄

③ 在Xshell中安裝"dependencies"中項目運行需要的所有依賴

npm install

全部安裝完成后，項目目錄下便會有node_modules文件夾了。

④ 啟動服務

這里默認已經云服務器已經安裝了Nodejs，3000端口也添加到了安全組，且已經為Nodejs創建軟鏈接（使node和npm命令全局有效，若未完成這一步請參考上一篇博文）

node app.js

運行app.js文件，在瀏覽器打開 服務器公網IP:80（如：263.182.35.68:80），就可以正常運行訪問了。這里我使用的是網易云音樂提供的開源的api。

四、安裝pm2

上面我們以 node app.js 啟動了項目，當我們退出 Xshell 時，進程就會關閉，無法再訪問到項目，而 pm2 就是解決這種問題的，以 pm2 啟動項目后，退出 Xshell 后依然可以正常訪問。

① 安裝pm2

npm install -g pm2

注：以 -g 全局安裝的插件都在 node 安裝目錄 bin 文件下

② pm2配置全局變量

我們為了可以在任何目錄都可以使用pm2命令，我們將此文件夾加入環境變量

whereis pm2

查詢pm2的安裝路徑 顯示是： /opt/node/bin/pm2

ln -s /opt/node/bin/pm2 /usr/local/bin pm2

這一步為pm2配置全局變量
注意這里如果重復操作有可能會出現以下錯誤：
failed to create symbolic link ‘/usr/local/bin/pm2’: File exists
這里只需要刪除并重新創建軟鏈，再執行pm2

mv /usr/local/bin/pm2 /tmp/ ln -s /opt/node/bin/pm2 /usr/local/bin pm2

③ 啟動項目

cd /var/www/html/music/dist/serverpm2 start app.js

這樣以 pm2 啟動項目后，退出 Xshell 后，就依然可以正常訪問了。
貼上項目跑起來以后的地址：http://arwin521.top/music/arwin/#/music/toplist

總結

以上是生活随笔為你收集整理的将Vue+Nodejs项目部署到阿里云服务器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。