如何给Vue项目配置好一个nginx.conf文件？

AAA_调皮捣蛋-

已于 2024-12-10 14:50:34 修改

阅读量264

点赞数 3

文章标签： vue.js nginx 前端

于 2024-11-12 11:21:42 首次发布

本文链接：https://blog.youkuaiyun.com/PcZxq/article/details/143706428

版权

解析一下conf文件：

 server {
        listen       80;
        server_name  localhost;

       # root   html; #配置自己的静态文件的路径，就是刚刚将打包的vue项目上传的路径，我这里是nginx根路径下的html文件中

        location / {
            root   html;
            index  index.html index.htm;
 
        }
   

        }

listen:监听的端口

server_name:IP地址

localhost /:很多人都会把这里写错，这个不是指整个文件的地址，而是接口后面路径

root：nginx的文件作为根目录, 目录下的html文件夹下index文件

反向代理配置如下：

server {

        listen       3000;
        server_name  127.0.0.1;


         location / {  
        proxy_pass http://127.0.0.1:3000; 
        proxy_set_header Host $host;  
        proxy_set_header X-Real-IP $remote_addr;  
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;  
        proxy_set_header X-Forwarded-Proto $scheme;  
    }