エラー報告

React Routerは、ルートモジュール内のエラーをキャッチし、エラー発生時に空白ページが表示されないようにエラー境界に送信します。ただし、ErrorBoundaryはエラーのログ記録と報告には不十分です。キャッチされたエラーにアクセスするには、サーバーエントリモジュールのhandleErrorエクスポートを使用します。

1. サーバーエントリを表示する

アプリケーションディレクトリにentry.server.tsxが表示されない場合は、デフォルトのエントリを使用しています。次のCLIコマンドで表示します。

react-router reveal

2. エラーハンドラーをエクスポートする

この関数は、React Routerがサーバー上のアプリケーションでエラーをキャッチするたびに呼び出されます。

import { type HandleErrorFunction } from "react-router";

export const handleError: HandleErrorFunction = (
  error,
  { request }
) => {
  // React Router may abort some interrupted requests, don't log those
  if (!request.signal.aborted) {
    myReportError(error);

    // make sure to still log the error so you can see it
    console.error(error);
  }
};