[ Vercel ] Type error: Type '{ params: string }' does not satisfy the constraint 'PageProps'.

1. 개요

Next.js 프로젝트를 Vercel을 이용해 배포하려 했는데 아래의 오류 메세지가 뜨며 빌드가 실패했다.

Type error: Type '{ params: string }' does not satisfy the constraint 'PageProps'.

로컬에서 빌드(dev, build)시에는 정상적으로 빌드되었는데 Vercel에서 배포하려니 해당 오류가 발생하는것을 확인했다.

 

2. 원인

Next.js 15.1부터 Dynamic routing을 이용할 때 params의 타입이 Promise로 바뀌어서 발생하는 이슈이다.

아래와 같이 params를 이용하면 동일한 오류가 발생한다.

export default async function Home({ params }: { params: string }) {
	...
}

 

3. 해결

params의 타입을 Promise로 변경하면 된다.

type PageParams = Promise<{ slug: string }>;

export default async function Home({ params }: { params: PageParams }) {
	...
}

 

4. 참고자료

https://nextjs.org/blog/next-15#async-request-apis-breaking-change

https://nextjs.org/docs/app/api-reference/functions/generate-metadata#generatemetadata-function

https://github.com/vercel/next.js/discussions/71997