nextjs build_error ai_generated true

错误:并行路由插槽 '@slot' 缺少 default.tsx。当插槽未被当前路由匹配时,需要提供 default.tsx。

Error: Missing default.tsx for parallel route slot '@slot'. A default.tsx is required when the slot is not matched by the current route.

ID: nextjs/parallel-route-missing-default-slot

其他格式: JSON · Markdown 中文 · English
95%修复率
90%置信度
1证据数
2024-06-15首次发现

版本兼容性

版本状态引入弃用备注
Next.js 14.x active
Next.js 15.x active

根因分析

并行路由插槽(例如 @modal)在其目录中没有 default.tsx 文件。当导航到与该插槽中任何文件都不匹配的路由时,Next.js 需要 default.tsx 来渲染回退内容。

English

A parallel route slot (e.g., @modal) does not have a default.tsx file in its directory. When navigating to a route that does not match any file in that slot, Next.js requires a default.tsx to render fallback content.

generic

官方文档

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

解决方案

  1. 在插槽目录中创建 default.tsx 文件。示例:// app/@modal/default.tsx export default function Default() { return null; } 当插槽不匹配时,这将不渲染任何内容。
  2. 如果需要回退 UI,请创建带有实际内容的 default.tsx:// app/@sidebar/default.tsx export default function Default() { return <div>默认侧边栏内容</div>; }
  3. 仅在始终匹配的布局中使用并行路由插槽,确保每个路由在插槽中都有对应的文件。这避免了需要 default.tsx,但灵活性较差。

无效尝试

常见但无效的做法:

  1. 90% 失败

    Catch-all routes only work for dynamic segments, not for unmatched routes in parallel slots. The framework specifically looks for default.tsx to handle the fallback case.

  2. 30% 失败

    This is an overreaction that removes the parallel routing feature entirely. It works but loses the architectural benefit of parallel routes, making it a poor practical fix.

  3. 95% 失败

    Parallel route slots must be prefixed with @. A regular page.tsx will not be treated as a slot and will conflict with the parent route's page.