완벽보다는 완료

  • 홈
  • 태그
  • 방명록

Babel 1

React) Next.js Styled-Components ClassName 오류

버튼 컴포넌트를 사이즈/색깔별로 나누면서 스타일링 하던중에 이런 오류가 발생 랜더링 할때마다 css 스타일이 적용이 안되는 오류가 발생하였다. 그래서 브라우저에서 개발자 페이지를 봐보니 Warning : Props 'className' did not match. Server : "dsdfsdf" Client: :"sdfssdf" 이런 문구가 나오는 오류여서 확인해 보니 babel을 설치하면 해결이 된다고 하여 구글링을 통해 원인과 해결방법을 알게 되었다. 원인 : Next.js는 SSR을 도와주는 프레임워크이며 SEO 등을 위해 처음 페이지를 로드할 때는 서버에서 렌더해 오지만, 페이지에서 링크를 클릭해 다른 페이지로 넘어갈 때는 CSR로 페이지를 렌더링하여 SEO와 속도를 해결해주는 프레임워크로 작동하..

React 2021.06.28
이전
1
다음
프로필사진

완벽보다는 완료

  • 분류 전체보기 (12)
    • React (5)
    • IT지식 (3)
    • Javascript (3)

Tag

리액트클래스컴포넌트, Styled-Components ClassName, styled components, Next.js Styled-Components ClassName, 리엑트, 리액트함수형컴포넌트, Next.js Styled-Components ClassName 오류, 리액트컴포넌트, ES next기술, Functional Component, Styled-Components 오류, React Hooks, 리액트라이브러리, 리액트 CSS, ES next, React Hook, Next.js, 리엑트훅, Next.js Styled-Components ClassName dhfb, styled-component,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

  2025. 07  
일 월 화 수 목 금 토
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

방문자수Total

  • Today :
  • Yesterday :

Copyright © Kakao Corp. All rights reserved.

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환
Q
Q
새 글 쓰기
W
W

블로그 게시글

글 수정 (권한 있는 경우)
E
E
댓글 영역으로 이동
C
C

모든 영역

이 페이지의 URL 복사
S
S
맨 위로 이동
T
T
티스토리 홈 이동
H
H
단축키 안내
Shift + /
⇧ + /

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.