Missing Error Boundary

Route layouts without a matching error.tsx

warningReliabilitymissing-error-boundary

Why this matters

Without an error.tsx, a runtime error in any component crashes the entire page with no recovery option. Users see a blank screen with no way to retry.

Bad
// app/dashboard/page.tsx exists
// app/dashboard/error.tsx is MISSING
// A runtime error shows a blank white screen
Good
// app/dashboard/error.tsx
"use client";

export default function Error({
  error,
  reset,
}: {
  error: Error;
  reset: () => void;
}) {
  return (
    <div>
      <h2>Something went wrong</h2>
      <button onClick={reset}>Try again</button>
    </div>
  );
}

How to fix

Add an error.tsx file to every route segment that could fail (especially those with data fetching). Include a retry button that calls reset().

All rules