如何关闭Vitejs的热模块重新加载？

Question

我有一个服务器端渲染生产模式vite应用程序。我的问题是：通常将网页重新加载，并且控制台将显示[vite]连接...。我将其追溯到Vite代码库的热模块重新加载部分。但是，我不希望hmr用于production，但是无论我将下面的两个设置设置为false：

在我的vite.config.js文件中，我有：

...
export default defineConfig({
  server: {
    hmr: false,
  },

也：在我的nodejs server.js文件中我有：

const vite = await createViteServer({
  server: { middlewareMode: 'ssr', hmr: false },
})

如何关闭Vite的HMR ？

Answer 1

只需修改server vite.config.ts中的属性：（

server: {
    hmr: false
}

这似乎是最简单的方法。）

信用： https://stackoverflow.com/a/77129725/152711

Answer 2

如果您希望完整重新加载而不是热模块重新加载，则可以将以下插件添加到vite.config.ts。

{
    name: 'full-reload',
    handleHotUpdate({ server }) {
        server.ws.send({ type: "full-reload" })
        return [];
    }
}

以前的替代解决方案：

解决方案1

​​Vite具有 hmr api重新加载。您可能还对 hmr Server config 您的vite.config.ts文件。

// index.ts
if (import.meta.hot) {
    import.meta.hot.accept(() => {
        import.meta.hot.invalidate();
    })
}

解决方案2

VITE还具有- 禁用热模块重新加载的No-HMR标志。

vite --no-hmr

解决方案3

不幸的是，解决方案1和2对我不起作用。这就是为什么我将以下代码添加到我的主/索引文件中，以在HMR发生后迫使浏览器重新加载。

// index.ts
if (window['reload']) window.location = window.location;
window['reload'] = true;

Answer 3

将其添加到您的app.js文件：

if (import.meta.hot)
import.meta.hot.accept(() => import.meta.hot.invalidate())

以及在您的vite.config.js文件中，文件添加 false 'decteConfig'：

// server.hmr.overlay property
defineConfig({          
    server: {
        /*here*/
        hmr: { overlay: false }
    }, ...
  })