一、前言
最近在B站學習了一下全棧開發，使用到的技術棧是Vue+Element+Express+MongoDB，為了讓自己學的第一個全棧項目落地，於是想着把該項目部署到阿里雲服務器。經過網上一番搜索和自己的一頓操作后，我在這里記錄一下自己的部署過程，方便以后查閱。
參考博客：
https://segmentfault.com/a/1190000012186563?utm_source=tag-newest
https://blog.csdn.net/weixin_43503511/article/details/86670937
二、環境
阿里雲服務器（輕量應用服務器）——保證安裝好node和vue3
vue3
node(express框架)
三、部署過程
1.本地測試
要想全棧項目能在雲服務器上正常運行，必須要先保證全棧項目在本地可以跑通！
全棧項目結構：
后端：
前端：
注意：
把前端項目放進后端項目目錄下的原因主要是為了方便本地調試。在本地調試時，只運行一條命令 npm run dev，就同時啟動前后端工程項目了，如下所示：
本地跑通后，修改一些配置就可以部署到雲服務器了！
2.服務器部署
2.1 本地修改文件
2.1.1 在client=>src目錄下修改文件 router.js 內容：（設置 mode 屬性值）
2.1.2 在client目錄下修改文件 vue.config.js 內容：
注意：因為還沒有域名，所以后面的訪問都是以阿里雲服務器的公網ip為准
2.1.3 進入client目錄下，執行打包命令： npm run build ，會在client目錄下生成 dist 文件夾
2.1.4 將client目錄下生成的 dist 文件夾拷貝到 node-app 目錄下
2.1.5 提前備份一下node-app目錄下的client文件夾，然后刪除node-app目錄下的client文件夾和node_modules文件夾，接着將 node-app 文件夾壓縮成 zip 文件，然后准備上傳到阿里雲服務器
壓縮后：
2.2 服務器配置
2.2.1 將前面的項目壓縮包上傳到阿里雲服務器
2.2.2 解壓node-app.zip文件
2.2.3 解壓node-app.zip文件后，進入node-app目錄下，執行命令： npm install （如果權限不夠，執行命令： sudo npm install）
2.2.4 修改資源路徑
修改node-app目錄下server.js文件的express配置內容，如下所示：
2.2.5 雲服務器開放端口
因為后端用到的端口是5000，所以要在雲服務器上開放5000端口，如下所示：
2.2.6 安裝pm2
服務器上使用 node 命令啟動項目時，如果我們退出 Xshell 時，進程就會關閉，無法再訪問到項目。因此，為了解決這個問題需要用到pm2。pm2 是一個帶有負載均衡功能的Node應用的進程管理器，可以保證進程永遠都活着，0秒的重載。
安裝命令： npm install -g pm2
啟動進程命令： pm2 start server.js
停止進程命令： pm2 stop server.js
查看進程命令： pm2 list
更多命令參考：https://www.jianshu.com/p/75e4c31517b7
2.2.7 測試
在node-app目錄下，執行命令： pm2 start server.js
在瀏覽器地址欄輸入雲服務器公網ip和端口號就可以正常運行了（如：241.23.15.23:5000）
