服務器使用Nginx部署Vue項目

首先得購買個服務器，在這就不教怎么購買了，本文章使用的是阿里雲輕量級服務器CentOS7.6

一、安裝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和443
• firewall-cmd --permanent --zone=public --add-service=http
• firewall-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地址加上端口號就可以了

如果是其他端口那么就要考慮服務器和阿里雲有沒有開放該端口號