【翻译】Vite 配置nginx反向代理解决重复刷新的问题

在内网机器上开发的时候,需要翻出去用外网机器查看效果,这里提供了vite这部分的实现原理以及对应的解决思路。

这篇文章和【vscode高级玩家】设置酷炫字体Fira Code文章一样属于翻译内容。

server.hmr

vite 的 server.hmr 属性用来禁用或配置HMR连接,但是实际上我们并不需要真正去配它,即使是官方的示例仓库也是通过反代来实现的。

简介

这些实例都没有使用server.proxy但是依然可以代理某些请求。

配置类型


基本

最基本的设置,没有任何特点。

中间件模式

在中间件模式下使用Vite。

后台服务

将 Vite 与后端服务器一起使用。请参阅后端集成指南。

使用代理

反向代理Vite。

使用代理(但不包含WebSocket)

警告如果可以的话,我建议使用上一条设置。它更简单。它的存在是为了展示“直接Websocket连接回退”功能。

在不支持代理Websocket的反向代理中面使用Vite。

英文原文(仓库)链接