vue 部署 Linux Debian 11 Nginx

上一篇地址：

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

我这完整配置如下：

 

user www-data;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events {
    worker_connections 768;
    # multi_accept on;
}

http {

    ##
    # Basic Settings
    ##

    sendfile on;
    tcp_nopush on;
    types_hash_max_size 2048;
    # server_tokens off;

    # server_names_hash_bucket_size 64;
    # server_name_in_redirect off;

    include /etc/nginx/mime.types;
    default_type application/octet-stream;

    ##
    # SSL Settings
    ##

    ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3; # Dropping SSLv3, ref: POODLE
    ssl_prefer_server_ciphers on;

    ##
    # Logging Settings
    ##

    access_log /var/log/nginx/access.log;
    error_log /var/log/nginx/error.log;

    ##
    # Gzip Settings
    ##

    gzip on;
    server
    {
        listen 8080;
        server_name localhost;
            
        root /home/hwp/文档/tgyth3_web/dist;
        location / {
            try_files $uri $uri/ @router;
            index index.html index.htm;
            }
        location @router{
                rewrite ^.*$ /index.html last;
            }
    }
    # gzip_vary on;
    # gzip_proxied any;
    # gzip_comp_level 6;
    # gzip_buffers 16 8k;
    # gzip_http_version 1.1;
    # gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

    ##
    # Virtual Host Configs
    ##

    include /etc/nginx/conf.d/*.conf;
    include /etc/nginx/sites-enabled/*;
}


#mail {
#    # See sample authentication script at:
#    # http://wiki.nginx.org/ImapAuthenticateWithApachePhpScript
#
#    # auth_http localhost/auth.php;
#    # pop3_capabilities "TOP" "USER";
#    # imap_capabilities "IMAP4rev1" "UIDPLUS";
#
#    server {
#        listen     localhost:110;
#        protocol   pop3;
#        proxy      on;
#    }
#
#    server {
#        listen     localhost:143;
#        protocol   imap;
#        proxy      on;
#    }
#

最后测试一下端口 看看有没有问题，界面是否出来。