上傳文件至云服務(wù)器

一、打包文件

在項目根目錄下運行

npm run build

等待命令運行結(jié)束后，會發(fā)現(xiàn)目錄下多了 dist 文件夾，這個文件夾就是我們等下要放到服務(wù)器中的。

二、文件傳輸

打開 Xftp與實例建立連接

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

將項目本地的dist文件夾的內(nèi)容移到云服務(wù)器music文件夾下（準(zhǔn)備好前端資源）

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

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

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

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

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

三、初始化項目

① 輸入以下兩行代碼進(jìn)入項目

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

② 上傳 package.json到服務(wù)器目錄

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

npm install

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

④ 啟動服務(wù)

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

node app.js

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

四、安裝pm2

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

① 安裝pm2

npm install -g pm2

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

② pm2配置全局變量

我們?yōu)榱丝梢栽谌魏文夸浂伎梢允褂胮m2命令，我們將此文件夾加入環(huán)境變量

whereis pm2

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

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

這一步為pm2配置全局變量
注意這里如果重復(fù)操作有可能會出現(xiàn)以下錯誤：
failed to create symbolic link ‘/usr/local/bin/pm2’: File exists
這里只需要刪除并重新創(chuàng)建軟鏈，再執(zhí)行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

總結(jié)

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

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。