[next.js]dynamic 옵션

dynamic 옵션

특정 페이지의 유형을 강제로 Static 또는 Dynamic 페이지로 설정할 수 있는 옵션

 

1. auto

• 기본값
• 어떤 설정도 강제하지 않음

export const dynamic = 'auto'

 

2. force-dynamic

• 페이지를 강제로 Dynamic 페이지로 설정

export const dynamic = 'force-dynamic';

 

3. force-static

• 페이지를 강제로 Static 페이지로 설정
• props가 undfined로 설정됨
• 하위 데이터 패칭 함수에서 cache:'no-store'를 사용하더라도 강제로 캐싱됨
• 정적페이지로 강제됨
• 단점: 검색 페이지 등 동작이 필요한 페이지에서 문제가 발생

export const dynamic = 'force-static';

 

4. error

• 페이지를 강제로 Static 페이지 설정
• 이 옵션을 사용하면 빌드 오류가 발생할 수 있으므로 권장하지 않음

export const dynamic = 'error'

 

 

⚠️ dynamic 옵션은 권장되지 않음

Next.js는 컴포넌트 단위로 자동으로 동적/정적 페이지를 인식하는데, 강제로 옵션을 설정하면 정상적으로 작동하지 않을 가능성이 있음!