Nginx部署Vue

用的若依的springboot + vue框架，后端打包成jar就好了；

1.  前端Vue打包命令：npm run build:prod

    会生成dist目录，里面有

2.  把dist目录上传到某个目录下，例如我放在：/usr/local

        随后配置Nginx的Nginx.conf文件

#user root;
worker_processes  1;

events {
    worker_connections  1024;
}


http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;

        location / {
            root   /usr/local/dist; # 路径改成自己的dist路径
            try_files $uri $uri/ /index.html;
            index  index.html index.htm;
        }

        location /prod-api/{
                proxy_set_header Host $http_host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header REMOTE-HOST $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_pass http://ip:port/; #设置监控后端启动的端口
        }


        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
                root html;
        }

	}
}

3. 最后重启Nginx：/usr/local/Nginx/sbin/Nginx -s reload -c /usr/local/Nginx/conf/Nginx.conf

/usr/local/Nginx/sbin/Nginx  --  Nginx的绝对路径

/usr/local/Nginx/conf/Nginx.conf  -- 配置文件的绝对路径，表示用该配置文件启动Nginx

重启之后，浏览器输入服务器IP即可访问了

参考：https://www.jb51.net/article/241964.htm

原文地址：https://www.jb51.cc/wenti/3282760.html