使用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)

相关推荐
excel1 分钟前
Vue SFC 样式编译核心机制详解:compileStyle 与 PostCSS 管线设计
前端
excel2 分钟前
🧩 使用 Babel + MagicString 实现动态重写 export default 的通用方案
前端
excel2 分钟前
Vue SFC 编译器主导出文件解析:模块组织与设计哲学
前端
excel5 分钟前
深度解析:Vue SFC 模板编译器核心实现 (compileTemplate)
前端
excel6 分钟前
Vue SFC 解析器源码深度解析:从结构设计到源码映射
前端
excel10 分钟前
Vue SFC 编译全景总结:从源文件到运行时组件的完整链路
前端
excel11 分钟前
Vue SFC 编译核心解析(第 5 篇)——AST 遍历与声明解析:walkDeclaration 系列函数详解
前端
elvinnn13 分钟前
提升页面质感:CSS 重复格子背景的实用技巧
前端·css
excel14 分钟前
Vue SFC 编译核心解析(第 7 篇)——最终组件导出与运行时代码结构
前端
excel15 分钟前
Vue SFC 编译核心解析(第 6 篇)——代码生成与 SourceMap 合并:从编译结果到调试追踪
前端