伺服器使用Nginx部署Vue專案

2022-04-12 13:01:34

一、安裝Nginx

1. 使用XShell連線我們的伺服器

2. 設定 EPEL源

sudo yum install -y epel-release
sudo yum -y update

3. 安裝Nginx

sudo yum install -y nginx

以下的內容需要記住，特別是組態檔
安裝成功後，預設的網站目錄為： /usr/share/nginx/html
預設的組態檔為：/etc/nginx/nginx.conf

4. 開啟埠80和443

前提是要先開啟防火牆

systemctl start firewalld.service

重啟防火牆：firewall-cmd --reload
檢視防火牆狀態firewall-cmd --state
關閉防火牆systemctl stop firewalld.service
開啟埠firewall-cmd --add-port=8890/tcp --permanent （8890替換為要開啟的那個埠）
開啟80和443firewall-cmd --permanent --zone=public --add-service=httpfirewall-cmd --permanent --zone=public --add-service=https
開啟後要記得重啟防火牆 5. 伺服器開啟80和443埠號

開啟伺服器，點選防火牆，然後點選新增規則

在埠範圍那裡新增我們需要的就行了，這裡我們就新增80和443

6. Nginx 基本命令

啟動：systemctl start nginx
重啟：systemctl restart nginx
關閉：systemctl stop nginx
檢視狀態：systemctl status nginx
開啟開機自動啟動：systemctl enable nginx
關閉開機自動啟動：systemctl disable nginx

7. 驗證是否安裝成功

在電腦瀏覽器輸入伺服器的ip地址，出現歡迎到nginx就代表成功了，那麼就可以下一步了

二、部署vue

1. 打包vue專案

npm run build // 這個看情況 如果是版本那麼就根據情況

2. 上傳到伺服器

我們這裡是把這個放到了 /usr/local/webapp這個資料夾裡面
我們可以使用xftp進行上傳

3. nginx設定

執行 vim /etc/nginx/nginx.conf命令進入組態檔

這樣我們的vue就部署完成了
記得重啟一下nginx

4. 測試

在瀏覽器輸入我們伺服器的ip地址加上埠號就可以了

如果是其他埠那麼就要考慮伺服器和阿里雲有沒有開放該埠號

到此這篇關於伺服器使用Nginx部署Vue專案的文章就介紹到這了,更多相關Nginx部署Vue專案內容請搜尋it145.com以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援it145.com！

伺服器使用Nginx部署Vue專案

目錄

一、安裝Nginx

二、部署vue

熱門文章