Posts next.js 빌드 시 ReferenceError: self is not defined 해결
Post
Cancel

next.js 빌드 시 ReferenceError: self is not defined 해결

설명

  • 컴포넌트를 import 할 때 생길 수 있는 오류이다.
  • import 대상 컴포넌트에 오직 클라이언트에서만 사용할 수 있는 기능이
    포함된 경우, 사전 렌더링에 실패할때 이 오류가 발생한다.
  • next/dynamic을 사용하여 ssr를 사용하지 않고 import를 하면 된다.

예시

1
2
3
4
5
6
7
8
9
import dynamic from "next/dynamic";  
        
const YourClientOnly= dynamic(  
() =>  
  import("@/component/your-client-only").then(  
    (module) => module.ClientOnly  
  ),  
{ ssr: false }  
);  

참고

This post is licensed under CC BY 4.0 by the author.