上一篇地址：
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 #
最后测试一下端口 看看有没有问题，界面是否出来。