lottie-react 라이브러리를 사용해서 lottie json파일을 재생하는데, 로컬에서는 문제가 없었는데 vercel에 배포하다가 알게된 점을 공유합니다.
브랜치 푸시로 생성된 vercel delpoy que에서 ‘document is no defined’ 에러가 발생
lenis와 framer motion은 이전에도 사용했던 라이브러리라서 문제가 없는걸 알고 있었는데, nextjs에서 lottie를 처음 사용해본거였기에 lottie를 의심함.
구글링에 이미 같은 문제를 겪는 이슈들이 많아서, 프로젝트에 적용해 문제를 해결했습니다.
const Lottie = dynamic(() => import('lottie-react'), { ssr: false });