[React] sass 오류

yebeen·2022년 11월 22일

GEMSTONE

목록 보기

2/4

사용중인 버전 정보 :

$ node -v
v16.17.0
$ npm --v
8.19.3

작업을 하고 git에 push후 다시 clone, pull받은 후 npm install node-sass를 실패, 아래와 같은 오류가 발생했습니다.

$ npm cache clear
$ npm rebuild node-sass
// or
$ yarn cache clear
$ yarn rebuild node-sass

하지만 여전히 오류가 발생했습니다.

react에서 사용하는 라이브러리 중 sass-loader 와 node-sass의 버전이 호환 되는지 확인해야 합니다.

// 패키지의 버전 정보 확인
$ npm view node-sass versions

맞는 버전을 확인 했다면 해당 버전으로 다운로드 합니다.

$ npm uninstall node-sass  
$ npm install node-sass@6.0.0
// or
$ yarn remove node-sass
$ yarn add node-sass@6.0.0

이후 다시 npm install 후 npm start를 진행.. 이번엔 페이지에서 오류를 확인해줍니다. 😂

이제 더 이상 기존에 사용하던 node-sass(LibSass)를 사용하지 않는다고 합니다..
따라서 Dart Sass로 전환했습니다.

$ npm uninstall node-sass
$ npm install sass

전환 후 정상적으로 동작하는 것을 확인 할 수 있었습니다.

🐣🐥