Vercel 배포 실패

요약

로그상으로는 Turbopack이 구글 폰트를 resolve하지 못함
번들링 문제라고 판단하여 로컬에서 테스트했으나 정상 동작
Vercel의 빌드 캐시 상태가 꼬일 수 있기에 no-cache redeploy 실행

전체 로그

Vercel Google Font 에러Vercel Google Font 에러. GitHub Gist: instantly share code, notes, and snippets.

gist.github.com

해결 과정

로그를 보니 구글 폰트를 못찾았음을 확인했다.

turbopack 문제라고 하는데 로컬에서는 빌드(npm run build)가 정상적으로 동작한다.

Vercel 환경과 로컬 환경의 nextjs 버전이 일치하지 않음

버전을 통일하기 위해 아래 과정을 수행했으나 여전히 빌드 정상적으로 확인

node_modules 제거
.next 제거
npm ci
재빌드

처음에 예상했던 번들링 과정에서의 문제점은 아니라고 판단.
아래 PR도 preview deploy에 성공했기에 문제가 없었기에 빌드 문제는 아니라는 근거가 이를 뒷받침함.

[Feat] 그룹 투표 결과 페이지 구현 및 결과 조회 흐름 개선 (MC-211~214) by Leejaelim · Pull Request #269 · matchuri/frontend노션 백로그MC-211~214요약무엇을 변경했나요?그룹 투표 종료 후 최종 선정 메뉴와 주변 맛집을 확인할 수 있는 독립적인 투표 결과 페이지를 구현추천 세션에 저장된 위치와 반경을 기반으로 주변 맛집을 조회하고 기존 지도 및 맛집 목록 UI를 재사용방장이 투표를 종료하면 FINALIZED 상태로 전환되고 모든 그룹원이 투표 결과 보러...

github.com

이런 상황을 AI는 아래와 같이 예측함.

AI의 예측

로컬에서는 동일한 Next.js 16.2.9 + Turbopack + next/font/google 조합으로 빌드가 정상적으로 성공했기 때문에, 폰트 설정이나 Next.js 버전 자체의 문제일 가능성은 낮다고 판단했다.

반면 Vercel 로그에는 이전 배포의 Build Cache를 복원한 기록이 있었고, Vercel 환경에서만 @vercel/turbopack-next/internal/font/google/font resolve 오류가 발생했다. 이에 Vercel Build Cache가 꼬였을 가능성을 우선 원인으로 예측했다.

이후 Build Cache를 사용하지 않고 Redeploy한 결과 정상적으로 빌드가 성공하여, 이번 문제는 코드 자체보다는 Vercel의 기존 빌드 캐시 상태에 의해 발생한 문제로 확인되었다.