nginx部署VUE项目

将打包好的前端项目文件放到指定目录中
一开始我会想要把打包后的项目文件放到 Nginx 默认的目录,但这样实际上是不好的,项目文件完全可以放在单独的目录中方便统一管理

修改 Nginx 配置,指向上述目录
一般来说就是修改 Nginx 的默认配置文件 nginx.conf 即可,但不推荐这么做,既然上面使用了单独的目录管理项目文件,那么这里也推荐创建单独的 Nginx 配置文件来管理此项目的 Nginx 配置
在 Nginx 的默认配置文件 nginx.conf 中,最后一行写着 include /etc/nginx/conf.d/*.conf;
这说明只要是该目录下文件后缀为 conf 的文件都会被自动加载到 Nginx 配置中
所以可以前往该目录,创建此项目的配置文件

1.1 基本配置

server {
        listen 9000;
        server_name 1.1.1.3;
        #access_log logs/access_example.log  main;
        root /home/work/project/frontopwf/dist;
        location / {
                try_files $uri $uri/ @router;
        }
        location @router {
                rewrite ^.*$ /index.html last;
        }
}

前后端分离nginx配置

  server {
                    listen 9000;
                    server_name frontopwf.intra.yiducloud.cn;
                    access_log  /home/work/logs/vue_access.log main;
                    root /home/work/project/frontopwf/dist;
                    location / {
                                    try_files $uri $uri/ @router;
                    }
                    location @router {
                                    rewrite ^.*$ /index.html last;
                    }
    }


    server {
        listen       8000;
        server_name  workorder.intra.yiducloud.cn;
        access_log  /home/work/logs/workorder_access.log main;
        location / {
            proxy_pass http://127.0.0.1:8001;
        }
    }

重新启动 Nginx

nginx -s reload  #可以重新加载 Nginx 的配置文件,但如果配置文件有错,不一定会抛出异常
nginx -s stop #先停止 Nginx 服务,再使用 nginx 尝试启动 Nginx 服务,如果配置文件有异常,则会抛出异常告知启动失败

更新前端项目包
将更新后的前端项目打包,直接传到之前的前端文件目录即可,Nginx 不需要重启

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章