1代理vue项目
-
将项目通过build方式进行打包
npm run buid,会生成一个dist文件
-
配置niginx配置文件
` server块代码示例，进行替换即可
server {
listen 8083;
server_name localhost;#域名，可以替换为服务器域名地址
location / {
root E:/java_code/mall4j/front-end/mall4v/dist;#vue项目的打包后的dist;
try_files $uri $uri/ @router;#需要指向下面的@router否则会出现vue的路由在nginx中刷新出现404
index index.html index.htm;
}
#对应上面的@router，主要原因是路由的路径资源并不是一个真实的路径，所以无法找到具体的文件
location @router {
rewrite ^.*$ /index.html last;
}
location /prod-api/ { #vue前端所有接口都加上/api/前缀，然后代理到后端接口服务
rewrite ^/prod-api/(.*)$ /$1 break;
proxy_pass http://localhost:8085; #访问后端的地址
proxy_set_header Host $host;
proxy_set_header X-Forwarded-Host $server_name;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
client_max_body_size 1000m;
}
}`
