求助问答

next/image 图片模糊或变形，检查：① 是否设置了 width/height 或 fill ② fill 模式需要父容器 position: relative ③ priority 只给 LCP 图片 ④ sizes 属性帮助浏览器选择正确尺寸 ⑤ 避免在 Server Component...

Next.js 路由组 layout 中调用 auth() 报错，因为 layout 是所有子页面的公共外壳，async layout 会拖慢导航。解决：layout 保持同步，用客户端组件 + useSession() 读取 session 缓存。 Vercel NEXT_PUBLIC_ 环境变...

revalidateTag vs revalidatePath：revalidateTag 清除特定 tag 的缓存（fetch 时用 next.tags 标记），revalidatePath 清除特定路径的缓存。数据变更后 revalidatePath 更直接，精细控制用 revalidateTa...

Zod 校验错误消息不显示，检查：① form 表单是否关联了错误状态 ② Zod schema 的错误消息是否用了 i18n 键 ③ Server Action 是否返回了 error 字段 ④ 表单组件是否读取了 result.error 并显示。 Auth.js credentials 登录...

revalidateTag vs revalidatePath：revalidateTag 清除特定 tag 的缓存（fetch 时用 next.tags 标记），revalidatePath 清除特定路径的缓存。数据变更后 revalidatePath 更直接，精细控制用 revalidateTa...

Next.js Server Action 返回 undefined，可能是 Action 函数没有 return 值，或 return 的对象结构不对。Server Action 应该返回 { success: boolean, data?: T, error?: string } 格式。 Ne...

Prisma migrate 报 database does not exist，需要先创建数据库。用 npx prisma db push 或手动 createdb。如果是 Vercel Postgres 或 Supabase，确保 DATABASE_URL 指向正确的数据库实例。 toast...

Prisma 索引没生效查询慢，确认：① 查询条件字段是否建了 @@index ② 迁移是否执行 ③ 用 EXPLAIN ANALYZE 查看执行计划 ④ 是否有函数索引需求 ⑤ 大表考虑分区。 middleware 重定向循环，一般是认证逻辑和业务重定向冲突。检查：① middleware 中是...

React Server Component 中使用 useState 报错，因为 Server Component 不能用 hooks。解决：① 把需要状态的组件拆成 Client Component（加 'use client'） ② 父组件保持 Server Component 做数据获取，子...

React Server Component 中使用 useState 报错，因为 Server Component 不能用 hooks。解决：① 把需要状态的组件拆成 Client Component（加 'use client'） ② 父组件保持 Server Component 做数据获取，子...

next/image 图片模糊或变形，检查：① 是否设置了 width/height 或 fill ② fill 模式需要父容器 position: relative ③ priority 只给 LCP 图片 ④ sizes 属性帮助浏览器选择正确尺寸 ⑤ 避免在 Server Component...

Prisma 连接池超时一般是 connection_limit 设置不当。Serverless 环境（Vercel）建议 connection_limit=1，因为每个函数实例独立连接。如果用 PgBouncer 或 Supabase connection pooler，URL 加 ?pgboun...

Prisma @@map 是表名映射（模型 → 数据库表名），字段 @map 是列名映射。混淆会导致查询的表/列名不匹配。规则：模型 PascalCase + @@map('snake_case')，字段 camelCase（DB 用 snake_case 时加 @map）。 Prisma 多对多...

Prisma @@map 是表名映射（模型 → 数据库表名），字段 @map 是列名映射。混淆会导致查询的表/列名不匹配。规则：模型 PascalCase + @@map('snake_case')，字段 camelCase（DB 用 snake_case 时加 @map）。 Vercel Edg...

next-intl t() 模板字符串拼接报错，因为动态拼接翻译键不被支持。用显式 Record 映射替代 t(`${type}Opt`)，改为 const labels: Record<string, string> = { ... } 然后 labels[type]。 Prisma $tran...

Auth.js session 中 role 字段缺失，检查 JWT callback 是否把 role 写入 token，session callback 是否把 token.role 写入 session.user.role。两步缺一不可。 Auth.js 5 signIn redirect:...

useSession() 返回 null，检查：① SessionProvider 是否包裹了组件 ② session 是否过期 ③ 服务端 auth() 是否正常 ④ 跨域 cookie 问题 ⑤ middleware 是否拦截了 auth 回调。 Auth.js 5 beta 的 sessio...

Prisma migrate 报 database does not exist，需要先创建数据库。用 npx prisma db push 或手动 createdb。如果是 Vercel Postgres 或 Supabase，确保 DATABASE_URL 指向正确的数据库实例。 Prisma...

Auth.js 5 beta 的 session 丢失问题，常见原因：① AUTH_SECRET 未配置或变了 ② cookie 被中间件清除 ③ JWT 过期。排查：检查 AUTH_SECRET 是否一致，middleware 中是否有不必要的 Set-Cookie，callbacks.jwt 是...

Next.js 动态 import 水合报错，可能是动态组件的 SSR 输出与客户端不一致。加 ssr: false 避免服务端渲染，或确保组件在 SSR 和 CSR 中输出一致。 next-intl t() 模板字符串拼接报错，因为动态拼接翻译键不被支持。用显式 Record 映射替代 t(`$...