Vue nginx部署

1、Nginx安装下载解压
在这里插入图片描述
2、 后端访问地址(postman直接访问后端地址)
在这里插入图片描述
3、前端未通过nginx访问后端(同台机器启动Vscode前端,Idea后端)
前端配置Vue nginx部署_第1张图片
首先看三个api,第一个api表示前端接口调用后都替换成http://127.0.0.1:1800/api/,第二个接口是因为后端1800/api中有api,则在pathRewrite里的’/api’: ‘’,改造配置![在这里插入图片描述](https://img-blog.csdnimg.cn/8f0dddb9d1654753a8926d82d8451e41.pngVue nginx部署_第2张图片
pathRewrite里的:冒号相当于重定向,由于后端接口都带有/api,所有pathRewrite里:冒号为接口的api
nginx中配置
在这里插入图片描述
保持一致
nginx中
设置
assetsPublicPath中有个路径时候
Vue nginx部署_第3张图片

在这里插入图片描述
static打好的包放在

这里,
若是
在这里插入图片描述

在这里插入图片描述
放在同一目录中

你可能感兴趣的:(vue,nginx,vue.js,前端)