從零開始,Windows操作系統下的超詳細的本地項目在阿里雲服務器的發布過程

• 圖片小,建議放大瀏覽器尺寸,不會失真.

🚀🚀 ==================== 步驟0: 購買阿里雲服務器 ====================

• 🎃 0.1 從來沒有搞過外網部署的我，當然是先買服務器了，感謝很多小伙伴的幫忙😊

• 🎃 0.2 登錄 阿里雲網址
  

• 🎃 0.3 選擇 雲服務器ECS (不要選香港的,后期備案容易出問題)

• 像我這種沒有經驗的先買一個月的試玩下,土豪請無視，任意選擇👍！

• 別心疼錢，續費很貴，建議一次性開3年，不是廣告，注意，這不是廣告！！！

• 選擇 Ubantu鏡像,社區大，資源多，出現問題比較容易得到解決
  
  

• 🎃 0.4 確認下單
  

• 🎃 0.5 確認支付
  

• 🎃 0.6 掃一掃，你就會損失一些money😭
  

• 🎃 0.7 恭喜你，拾取服務器一台😁
  

• 🎃 0.8 建議修改實例密碼，為本地機器訪問(請記住你設置的密碼)
  

🚀🚀 ==================== 步驟1: 開啟window的ssh ====================

• 🚖 1.1 右下角 -> 所有配置
  

• 🚖 1.2 應用
  

• 🚖 1.3 可選功能
  

• 🚖 1.4 添加可選功能 OpenSSH客戶端
  

• 🚖 1.5 測試ssh 是否啟動成功，命令行 ssh
  

• 🚖 1.6 用root賬戶連接阿里雲遠程服務器 ssh root@47.114.105.120 -p 22

• 47.114.105.120是雲服務器的外網ip, -p 22 指定端口為22

• password: 🎃 0.8中設置的密碼

ssh root@47.114.105.120 -p 22

• 哇，登錄成功了,好興奮啊,作為完全沒使用過Linux/Ubantu的小白來說不要太興奮 😋🙃

• 🚖 1.7 使用 ls命令查看服務器的文件

• 我之前發布項目創建過一個文件夾realworld-nuxtjs

• 具體步驟會在下一部分出現
  

🚀🚀 ==================== 步驟2: 遠程操作服務器,上傳項目的壓縮包 ====================

• 🏳‍🌈 2.1 給服務器創建一個目錄,存放要發布項目的資源
  

• 🏳‍🌈 2.2 跳轉到新建的目錄下
  

• 🏳‍🌈 2.3 准備要發布項目的壓縮包(依項目實際情況而定)

• 由於現在要發布的是nuxt項目,將這5個文件選中進行壓縮打包(壓縮后的文件是realworld-nuxtjs.zip)
  

• 🏳‍🌈2.4 新建一個本地命令窗口,使用scp(secure copy)上傳本地壓縮文件到遠程服務器

• scp = secure copy：Linux系統或者Ubuntu的安全copy命令

• 這部分操作不是在遠程ssh鏈接

• 而是壓縮文件所在的目錄

# 將2.3中本地壓縮的文件上傳到遠程服務器
scp .\realworld-nuxtjs.zip root@47.114.105.120:/root/realworld-nuxtjs
# 語法格式 scp filepath\filename account@remote address:root/directory

• 🏳‍🌈2.5 通過【ssh命令窗口】或者【服務器上的遠程連接】查看 上傳的文件, 本地打包的文件已經上傳到服務器了
  

🚀🚀 ==================== 步驟3: 服務器上的文件操作和必需的模塊安裝 ====================

• 以下操作可通過【ssh命令窗口】或者【服務器上的遠程連接】

• 操作目錄,之前新建的realworld-nuxtjs

• ⚡ 3.1 安裝 unzip模塊 => 解壓我們之前上傳的zip文件 apt install unzip
  

• ⚡ 3.2 安裝 nodejs模塊 提供項目的依賴環境

# 指定資源模塊: setup_12.x代表的是nodejs版本12.x,可根據自己的需要自行修改
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
# 安裝nodejs
sudo apt-get install nodejs

• ⚡ 3.3 安裝 npm模塊 提供項目的模塊依賴下載

# 安裝 npm 模塊
sudo apt install npm
#如果出現問題，執行
sudo apt-get install nodejs-dev node-gyp libssl1.0-dev
# 然后再執行
sudo apt install npm

• 通過npm -v 和 node -v 查看是否安裝成功
  

• ⚡ 3.4 解壓上傳的資源包

# 解壓資源包
unzip realworld-nuxtjs

• ⚡ 3.5 安裝依賴

# 根據package.json安裝項目的相關依賴
npm install 

• ⚡ 3.6 運行項目

npm run start

• 成功了!!!

🚀🚀 ==================== 步驟4: IP/PORT 配置項 ====================

• 🔰 4.1 IP

• 步驟3中項目啟動后的地址是服務器的私有IP http://172.27.110.181:3000/ 不能對外訪問

• 需要將自己的公網IP替換后才可以 http://47.114.105.120:3000
  

• 🔰 4.2 端口,3000端口號是在項目文件里配置的,所以我們要去【本實例安全組】開啟3000端口的使用

• 【本實例安全組】-> 【配置規則】-> 【手動添加】

• 紅框內的是系統自帶的, 綠色的是手動添加的端口號為3000的一條規則
  

• 到這里,如過沒有特殊情況,服務可以被外網訪問了 RealWorld-Nuxt ✅

🚀🚀 ==================== 步驟5: 其他配置項 ====================

• 💛 5.1 查看服務器防火牆狀態

# 服務器防火牆狀態: active-啟動 | inactive-關閉
sudo ufw status
# 開啟或關閉
sudo ufw enable|disable

• 💛 5.2 查看端口號狀態

netstat -anp|grep 3000

• 💛 5.3 安裝yarn

# step-1 : make sure that all your system packages are up-to-date by running these following apt-get commands in the terminal.
sudo apt-get update
sudo apt-get upgrade

# step-2 : Yarn repository and import the repository’s GPG key:
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list

# step-3 : update the package index and install Yarn using following command:
sudo apt-get update
sudo apt-get install yarn

# step-4 : Verify the installation
yarn --version

🚀🚀 ==================== 補充: 安裝pm2 ====================

• pm2 工具可以在后台運行程序

npm install -g pm2

• 安裝成功后, 在項目路徑下執行 pm2 start npm- start 運行