eerror1 [NEXT.JS] Warning : Props 'className' did not match와 suppressHydarationWarning 이런 에러가 발생했다. 위 에러는 처음 페이지 SSR로 내려준 이후 CSR로 화면을 렌더링하게 되는데, 이때 서버에서 받은 해시 + 클래스명과 이후 클라이언트에서 작동하는 해시 + 클래스 명이 달라지면서 스타일을 불러올 수 없는 문제를 발생한다. 구글링 해보니까 보통 styled component에서 많이 발생하는 에러인 것 같다. 그러나 나는 tailwind를 사용하고 있었다. 에러를 자세히 보니 dark가 있었고 이것은 다크모드 설정에서 발생된 에러같았다. 나의 다크모드에는 세가지 종류가 있는데 Light, Dark, System 이 있는데. 서버에서는 localStorage에 저장된 나의 테마상태를 모르기때문에 발생되는 에러다. 리액트 공식문서에 있는 suppressHydrationWarning으로.. 2023. 7. 11. 이전 1 다음
