LiveReload

`<LiveReload />`

このコンポーネントは、アプリを Remix リソースサーバーに接続し、開発中にファイルが変更されると自動的にページを再読み込みします。本番環境では、null をレンダリングするため、常にルートルートで安全にレンダリングできます。

import { LiveReload } from "@remix-run/react";

export default function Root() {
  return (
    <html>
      <head />
      <body>
        <LiveReload />
      </body>
    </html>
  );
}

プロパティ

`origin`

Live Reload プロトコルのカスタムオリジンを指定します。提供される URL は http プロトコルを使用する必要があり、内部で ws プロトコルにアップグレードされます。これは、Remix dev サーバーの前にリバースプロキシを使用する場合に便利です。デフォルト値は REMIX_DEV_ORIGIN 環境変数で、設定されていない場合は window.location.origin となります。

`port`

Live Reload プロトコルのカスタムポートを指定します。デフォルト値は REMIX_DEV_ORIGIN 環境変数から派生したポートで、設定されていない場合は 8002 となります。

`timeoutMs`

timeoutMs プロパティは、Live Reload プロトコルのカスタムタイムアウト時間（ミリ秒単位）を指定できます。これは、Web Socket 接続が失われた後に再接続を試みる前の遅延時間です。デフォルト値は 1000 です。