使用nginx部署Vue项目

前提是后端已经跨域!

下载nginx,在路径下使用cmd打开nginx,关闭nginx使用任务管理器details end task

把dist中的文件都放到html文件夹中

打开conf,找到nginx.conf,编辑以下内容

location就是刚才放dist文件的那个文件夹,index就是指向主页的那个文件。

我这里前端是用/api/来与后端通信的,后端直接是http://127.0.0.1:8000/getdata,而不是http://127.0.0.1:8000/api/getdata,所以我用

复制代码
rewrite "^/api/(.*)$" /$1 break;

把api替换掉了,然后它的指向就正确了

nginx rewrite 用法,用rewrite去除URL中的特定参数-腾讯云开发者社区-腾讯云 (tencent.com)

相关推荐
Highcharts.js13 分钟前
AI向量知识谱系图表创建示例代码|Highcharts网络图表(networkgraph)搭建案例
开发语言·前端·javascript·网络·信息可视化·编辑器·highcharts
野熊佩骑22 分钟前
一文读懂Nginx 之 Ubuntu使用apt方式安装Nginx官方最新版本
linux·运维·服务器·nginx·ubuntu·http
zhangxingchao30 分钟前
AI应用开发五:RAG高级技术与调优
前端·人工智能·后端
KaMeidebaby41 分钟前
卡梅德生物技术快报|单 B 细胞抗体技术:全犬源单抗制备流程、关键参数与性能验证
前端·数据库·其他·百度·新浪微博
hazel1 小时前
网络与工程化
前端
KnowWhere1 小时前
Vue3 调试技巧:一键挂载组件实例到 Window(仅开发环境生效)
vue.js
墨着染霜华1 小时前
Windows 启动 Nginx 一闪而过、pid 丢失、logs 目录报错彻底解决
运维·windows·nginx
甜味弥漫1 小时前
一篇文章搞懂CSS中的定位布局
前端
A南方故人1 小时前
vue3常用指令以及注册
前端·javascript·vue.js
helloweilei1 小时前
Vue 3 中 <script setup>顶层 await与 <Suspense>的结合使用
vue.js