Next.js中Type '{ params: PageParams; }'不满足PageProps约束的类型错误

错误根源 #

代码里的核心问题是：在Next.js App Router的服务器组件中，params是直接传入的普通对象，并非Promise，但你错误地使用了await params来解构slug。这导致TypeScript判定params应该是Promise类型，和你定义的PageProps里的普通对象类型冲突，进而抛出类型不匹配错误。

修复步骤 #

1. 移除多余的await关键字 #

直接从params中解构slug，无需等待操作：

export default async function Page({ params }: PageProps) {
  // 删掉await，直接解构params
  const { slug } = params;

  const data: Block[] | null = await getPage(slug.join("/"));
  
  if (!data) {
    notFound();
  }

  return (
    <div>
      <BlockRenderer blocks={data || []} />
    </div>
  )
}

2. 保留正确的类型定义 #

你原本的PageProps定义是正确的，无需修改：

interface PageProps {
  params: {
    slug: string[];
  };
}

开发模式正常运行的原因 #

开发模式下Next.js的类型检查相对宽松，运行时的类型推断暂时掩盖了这个错误，但生产构建时TypeScript会严格校验类型，因此错误会被触发。

内容的提问来源于stack exchange，提问作者Konrad Czerniec