错误:并行路由插槽 '@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
版本兼容性
| 版本 | 状态 | 引入 | 弃用 | 备注 |
|---|---|---|---|---|
| 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.
官方文档
https://nextjs.org/docs/app/building-your-application/routing/parallel-routes#defaultjs解决方案
-
在插槽目录中创建 default.tsx 文件。示例:// app/@modal/default.tsx export default function Default() { return null; } 当插槽不匹配时,这将不渲染任何内容。 -
如果需要回退 UI,请创建带有实际内容的 default.tsx:// app/@sidebar/default.tsx export default function Default() { return <div>默认侧边栏内容</div>; } -
仅在始终匹配的布局中使用并行路由插槽,确保每个路由在插槽中都有对应的文件。这避免了需要 default.tsx,但灵活性较差。
无效尝试
常见但无效的做法:
-
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.
-
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.
-
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.