nextjs routing_error ai_generated true

Error: Missing default.tsx for parallel route slot

ID: nextjs/parallel-routes-default

Also available as: JSON · Markdown
92%Fix Rate
92%Confidence
50Evidence
2023-01-01First Seen

Version Compatibility

VersionStatusIntroducedDeprecatedNotes
14 active — — —

Root Cause

Parallel route slot needs a default.tsx fallback for unmatched routes.

generic

Workarounds

  1. 95% success Create a default.tsx in the slot directory that returns null or a fallback 
    // @slot/default.tsx
export default function Default() { return null; }

    Sources: https://nextjs.org/docs/app/building-your-application/routing/parallel-routes#defaultjs

  2. 90% success Add default.tsx to every parallel route slot that might not match 
    // Create a default.tsx for each parallel route slot:
// app/@sidebar/default.tsx:
export default function Default() {
  return null; // or a fallback UI
}

// This is rendered when no other route in the slot matches
// Every parallel route (@slot) needs a default.tsx

    Sources: https://nextjs.org/docs/app/building-your-application/routing/parallel-routes

Dead Ends

Common approaches that don't work:

  1. Remove the parallel route 70% fail

    Loses the parallel rendering feature

Error Chain

Frequently confused with: