티스토리 뷰

Web/프로젝트구현

TypeError: Cannot destructure property 'styles' of 'this.context' as it is null.

HAN_PY 2023. 3. 12. 17:00
반응형

Nextjs에서 TypeError: Cannot destructure property 'styles' of 'this.context' as it is null. 에러를 만났다면 해결책은 어렵지 않다.

 

 

 

 

<head /> 셋팅을 잘못해서 그렇다. _document 파일에서는 아래와 같이 셋팅을 하는 것이 맞다. 

 

import { Html, Head, Main, NextScript } from "next/document";

 

하지만 _document 파일 이외의 장소에서는  위에처럼 쓰면 안된다. 아래와 같이 사용하면된다. _app 파일을 예로 들면 아래와 같이 next/document 가 아닌 next/head로 사용을 하자.

 

import "@/styles/globals.css";
import type { AppProps } from "next/app";
import Head from "next/head";

export default function App({ Component, pageProps }: AppProps) {
  return (
    <>
      <Head>
        <title>Welcome to hanpy </title>
        <link rel="shortcut icon" href="/favicon.png" />
      </Head>
      <Component {...pageProps} />
    </>
  );
}
반응형
저작자표시 비영리 변경금지

'Web > 프로젝트구현' 카테고리의 다른 글

프런트엔드 아키텍처 기초 정리  (0) 2023.09.03
[React] 컴포넌트 설계 기초 정리  (0) 2023.08.22
[개발자 도구] TTFB(Time To First Byte)  (0) 2023.02.17
[javascript] event.keyCode 기초 정리  (0) 2023.02.11
[UX/UI] web focus 적용하기(tabindex)  (0) 2023.02.08
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
TAG more
«   2025/01   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30 31
글 보관함