上一篇地址：

https://www.cnblogs.com/piaoxuewuming/p/15574502.html

上一篇我寫了部署webapi 這一篇來部署VUE前端介面

1、安裝Nginx

安裝命令： sudo apt install nginx

開通防火牆：

檢視防火牆應用程式列表

sudo ufw app list

 sudo ufw app list
Available applications:
  AIM
  Bonjour
  CIFS
  DNS
  Deluge
  IMAP
  IMAPS
  IPP
  KTorrent
  Kerberos Admin
  Kerberos Full
  Kerberos KDC
  Kerberos Password
  LDAP
  LDAPS
  LPD
  MSN
  MSN SSL
  Mail submission
  NFS
  Nginx Full
  Nginx HTTP
  Nginx HTTPS
  OpenSSH
  POP3
  POP3S
  PeopleNearby
  SMTP
  SSH
  Socks
  Telnet
  Transmission
  Transparent Proxy
  VNC
  WWW
  WWW Cache
  WWW Full
  WWW Secure
  XMPP
  Yahoo
  qBittorrent
  svnserve
 

開通埠 這個相當於別名 也可以直接指定埠

sudo ufw allow 'Nginx HTTP'

也可以檢視防火牆狀態

sudo ufw status

開通好了，在其他電腦上訪問下，看看是否可以訪問 出現下面這個頁面代表成功了

nginx 管理

檢查nginx 狀態

systemctl status nginx

停止nginx

sudo systemctl stop nginx

啟動

sudo systemctl start nginx

重啟

sudo systemctl restart nginx

如果您只是在更改配置，Nginx通常可以在不斷開連線的情況下重新載入配置

sudo systemctl reload nginx

預設情況下，Nginx配置為在伺服器啟動時自動啟動。 如果這不是您想要的，則可以通過鍵入以下內容來禁用此行為

sudo systemctl disable nginx

要重新啟用該服務以在引導時啟動，可以鍵入：

sudo systemctl enable nginx

2、打包VUE 上傳到指定檔案

我這邊是通過FinalShell 這個連線的 直接拖過去就好

3、修改nginx 配置

sudo nano /etc/nginx/nginx.conf

指定root目錄

參考：

https://www.cnblogs.com/sunxun001/p/14031376.html

ctrl+X 離開儲存

重新整理配置

sudo systemctl reload nginx

我這一直報錯

See "systemctl status nginx.service" and "journalctl -xe" for details.

報錯，我這邊是配置檔案問題

具體排查可以參考這篇文章

https://www.shuzhiduo.com/A/MAzA7Qao59/

通過命令檢視配置問題：

sudo nginx -t

發現是url問題 應該是uri

我這完整配置如下：

 1 user www-data;
 2 worker_processes auto;
 3 pid /run/nginx.pid;
 4 include /etc/nginx/modules-enabled/*.conf;
 5 
 6 events {
 7     worker_connections 768;
 8     # multi_accept on;
 9 }
10 
11 http {
12 
13     ##
14     # Basic Settings
15     ##
16 
17     sendfile on;
18     tcp_nopush on;
19     types_hash_max_size 2048;
20     # server_tokens off;
21 
22     # server_names_hash_bucket_size 64;
23     # server_name_in_redirect off;
24 
25     include /etc/nginx/mime.types;
26     default_type application/octet-stream;
27 
28     ##
29     # SSL Settings
30     ##
31 
32     ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
33     ssl_prefer_server_ciphers on;
34 
35     ##
36     # Logging Settings
37     ##
38 
39     access_log /var/log/nginx/access.log;
40     error_log /var/log/nginx/error.log;
41 
42     ##
43     # Gzip Settings
44     ##
45 
46     gzip on;
47     server
48     {
49         listen 8080;
50         server_name localhost;
51             
52         root /home/hwp/文件/tgyth3_web/dist;
53         location / {
54             try_files $uri $uri/ @router;
55             index index.html index.htm;
56             }
57         location @router{
58                 rewrite ^.*$ /index.html last;
59             }
60     }
61     # gzip_vary on;
62     # gzip_proxied any;
63     # gzip_comp_level 6;
64     # gzip_buffers 16 8k;
65     # gzip_http_version 1.1;
66     # gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
67 
68     ##
69     # Virtual Host Configs
70     ##
71 
72     include /etc/nginx/conf.d/*.conf;
73     include /etc/nginx/sites-enabled/*;
74 }
75 
76 
77 #mail {
78 #    # See sample authentication script at:
79 #    # http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript
80 #
81 #    # auth_http localhost/auth.php;
82 #    # pop3_capabilities "TOP" "USER";
83 #    # imap_capabilities "IMAP4rev1" "UIDPLUS";
84 #
85 #    server {
86 #        listen     localhost:110;
87 #        protocol   pop3;
88 #        proxy      on;
89 #    }
90 #
91 #    server {
92 #        listen     localhost:143;
93 #        protocol   imap;
94 #        proxy      on;
95 #    }
96 #

最後測試一下埠 看看有沒有問題，介面是否出來。