반응형 Warning : Props 'className' did not match1 Warning : Props 'className' did not match client: server: 리액트에서는 전혀 말썽이 없던 styled-component가 말썽을 부렸다. Next는 서버에서 한번, 클라이언트에서 한번 총 두번 렌더링하게 되는데 이때 styled-component에 의해 랜덤으로 생성되는 클래스명이 일치하지 않아서 생기는 문제이다. 구글링을 통해 쉽게 해결할 수 있었다. npm i babel-plugin-styled-components 바벨 플러그인을 설치하고 바벨설정을 추가함으로 해결할 수 있다. .babelrc 설정 최상단 디렉토리에 .babelrc 를 추가하고 다음과 같이 작성 { "presets": ["next/babel"], "plugins": [ ["babel-plugin-styled-components", { "fileName": true, "displayName":.. 2022. 2. 7. 이전 1 다음 반응형