跳转到内容

LiveReload

<LiveReload />

此组件将您的应用连接到 Remix 资源服务器,并在开发过程中文件发生变化时自动重新加载页面。在生产中,它会呈现null,因此您可以安全地始终在根路由中呈现它。

app/root.tsx
import { LiveReload } from "@remix-run/react";
export default function Root() {
return (
<html>
<head />
<body>
<LiveReload />
</body>
</html>
);
}

Props

origin

为 Live Reload 协议指定自定义来源。提供的 URL 应使用 http 协议,该协议将在内部升级为 ws 协议。当在 Remix dev 服务器前使用反向代理时,这很有用。默认值是 REMIX_DEV_ORIGIN 环境变量,或仅当未设置 REMIX_DEV_ORIGIN 时才为 window.location.origin

port

为 Live Reload 协议指定自定义端口。默认值是从 REMIX_DEV_ORIGIN 环境变量派生的端口,或仅当未设置 REMIX_DEV_ORIGIN 时才使用 8002

timeoutMs

timeoutMs 属性允许为 Live Reload 协议指定自定义超时时间(以毫秒为单位)。这是在 Web Socket 连接丢失后尝试重新连接之前的延迟时间。默认值为 1000