강의

멘토링

커뮤니티

인프런 커뮤니티 질문&답변

parksh626님의 프로필 이미지
parksh626

작성한 질문수

[리뉴얼] React로 NodeBird SNS 만들기

SCSS를 SSR 하는 방법

작성

·

412

0

개인 프로젝트 스타일을 scss로 제작했는데 next에서 ssr을 하는 과정에서 어떻게 해야 좋을지 찾고 있습니다.

antd를 사용하지 않아서 css작업이 상당히 필요했기 때문에 익숙한 scss를 사용했는데 ssr문제를 해결하기 쉽지 않네요.

next에서 css를  ssr할때 어떤 방법으로 ssr할 수 있는지 궁금합니다.

답변 1

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

https://nextjs.org/docs/basic-features/built-in-css-support#sass-support

여기 보시면 sass 모듈을 설치하는 것만으로도 next에서 scss를 지원한다고 되어있는데

ssr인 안 되는건 어떤 때 안 되시는 건가요?

parksh626님의 프로필 이미지
parksh626
질문자

link를 통해서 페이지 전환을 하면 스타일이 안먹히고 새로고침을 누르면 스타일이 적용됩니다!

그래서 styled-component처럼 바벨이나 _document.js파일에서 따로 설정이 필요하다고 생각하고 방법을 찾아보고 있는데 어떻게 해결하면 좋을까요?

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

페이지별로 scss가 import되어 있는 것은 맞으시죠?

parksh626님의 프로필 이미지
parksh626
질문자

넵. module.scss로 import되어 있습니다.

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

className={styles.클래스명} 이렇게 쓰신 것도 맞죠?
저는 scss를 써본 적이 없어서 저도 검색해서 찾아보는 수밖에 없습니다.

parksh626님의 프로필 이미지
parksh626
질문자

아하 넵! 감사합니다! 클래스명 수정하니 됐습니다.

parksh626님의 프로필 이미지
parksh626

작성한 질문수

질문하기