nextjs build_error ai_generated true

错误:并行路由插槽 '@slot' 需要 Suspense 边界或 default.tsx

Error: Parallel route slot '@slot' requires a Suspense boundary or default.tsx

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

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

版本兼容性

版本状态引入弃用备注
[email protected] active
[email protected] active
[email protected] active

根因分析

在 Next.js app 目录中,并行路由插槽(例如 @modal)必须包裹在 Suspense 边界中,或具有 default.tsx 文件来处理插槽未匹配时的加载状态。

English

In Next.js app directory, parallel route slots (e.g., @modal) must be wrapped in a Suspense boundary or have a default.tsx file to handle loading states when the slot is not matched.

generic

官方文档

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

解决方案

  1. 在布局文件中将并行路由插槽包裹在 Suspense 边界中。
  2. 在插槽目录中创建 default.tsx 文件来处理未匹配的路由。

无效尝试

常见但无效的做法:

  1. 50% 失败

    This may cause layout shifts or missing UI because the slot renders nothing when unmatched, but the error persists if the slot is still not wrapped in Suspense.

  2. 90% 失败

    This eliminates the feature, which may not be acceptable for modals or complex layouts.