Notice
Recent Posts
Recent Comments
Link
목록styled-component (1)
거의 알고리즘 일기장
nextjs 사용시 FOUC 문제 해결 (html에 style이 먹지않아 깜빡이는 문제) with antd, styled-component
nextjs를 처음 사용해보는 권모씨 평소와 같이 antd, styled-component를 사용하던중 문제를 발견하는데... 아씨.. 왜이리 스타일이 늦게 먹는것 같지?.. 나는 react처럼 똑같이 세팅하고 그라는디.. ㅠ 이유가 무엇일까??... 이유는 바로 nextjs의 랜더링 방식에 있다!! nextjs는 (default인 ssg 기준으로) HTML을 빌드 타임에 각 페이지별로 생성하고 해당 페이지로 요청이 올 경우 이미 생성된 HTML 문서를 먼저 보낸다. 이때, 미리 빌드타임에 생성된 html 문서에 스타일링이 먹히지 않아서 FOUC(flash of unstyled content) 문제가 생기는것이다. (styled-component는 css-in-js 방식이므로 js파일에 있다. antd도..
web
2023. 2. 15. 19:57