'use client' 에러
app-index.tsx:25 Warning: Extra attributes from the server: class
at body
at html
at AdminLayout (webpack-internal:///(app-pages-browser)/./src/app/(admin)/layout.tsx:15:11)
at InnerLayoutRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/layout-router.js:243:11)
- 서버에서 렌더링된 HTML과 클라이언트에서 다시 렌더링된 HTML이 일치하지 않는 Hydration 오류 중 하나
- Next.js 프로젝트에서 서버사이드 렌더링(SSR) 또는 정적 사이트 생성(SSG)과 클라이언트 측 Hydration 과정에서 일관성이 맞지 않을 때 발생
- 'use client' 지시문과 HTML 태그 (, )가 함께 사용될 때 발생하는 문제
- Next.js에서는 클라이언트 컴포넌트에서 HTML의 , 태그를 직접 사용할 수 없음
- 이 태그들은 서버 컴포넌트에서만 사용
× You are attempting to export "metadata" from a component marked with "use client", which is disallowed. Either remove the export, or the "use client" directive. Read more: https://nextjs.org/
│ docs/getting-started/react-essentials#the-use-client-directive
- Next.js의 App Router에서는 metadata는 서버 전용
- client 지시문이 포함된 컴포넌트는 클라이언트에서만 실행
- 클라이언트 컴포넌트에서 metadata를 정의하려고 하면 이와 같은 오류가 발생
0개의 댓글
