SCSS-lint 가 왜 작동이 안될까..?

도네토·2022년 1월 3일
1

내 맥북에서는 자꾸만 SCSS-lint가 오류가 나곤했다.. 진짜 돈내고 인강 듣고있는데 왜!!! 설치가 안되느냔말이다!!!

다행히 이런 이슈가 나에게만 있는 것이 아닌지라 강사분이 잘 설명을 해주셨다..ㅠ (감사합니다 김버그님 😭)

왜? 안돼?

VSCode SCSS-lint extension이 제대로 동작하려면 Ruby Sass가 컴퓨터에 설치되어 있어야 한다고 합니다.. 코린이인 저의 컴퓨터에 Ruby가 깔려있을리 만무하죠? 허허 짜증나죠?

그래도 마음을 가라앉히고 '역시 공부는 정석대로지!' 라는 헛된 마인드를 가지고 정석대로 ruby부터 설치를 시작해 봤습니다.
(해봤는데 안됐으니 텍스트로만 써야지)

Ruby 설치

1번 정석

맥에서는 Homebrew를 설치하고 터미널에서 brew install ruby를 하면 설치가되고 터미널에서
gem install scss_lint 를 실행하여 scss_lint를 설치하면 된다고 하지만.

ㅋ... 성공 했을리가.. 에러만 뜨면서 아주 사람 복장을 뒤집어 놓더라.. 포기안하고 Ruby의 다른 버전을 설치하면서 해봤지면 결국 실패했다. 이 방법은 Pass..

2번 우회

scss-lint 대신 sass-lint로 우회하자.  사실 두개의 큰 차이점은 없는 편이다. 
내가 알기로 둘의 차이점은 {}의 유무였던 것 으로 기억한다. Sass에서는 {}을 작성하지 않아도 됐던거로 기억한다.. 아마도?

아무튼 VScode Sass Lint extension 을 설치하고 vscode 터미널에 npm i -D sass-lint를 실행하면

package.json에 이렇게 적힐꺼다..
.sass-lint.yml 을 생성하고
.sass-lint.yml 의 내용을 추가하자...


이 친구가 날 살려줬다. 2-3시간을 scss 설치하려 노력했건만.. 우회 한번에 살아났다

3. 마지막 우회? stylelint

2번도 안되면 마지막 방법
npm install -D stylelint stylelint-config-recess-order stylelint-config-standard stylelint-scss

이걸 4개로 나눠서 하는건지.. 한방에 하는건진 안해봐서 모르게따..

.stylelintrc.json을 생성하고
내용을 넣어주자
https://gist.github.com/donato14/23655c80ec6af8cdfe5036038f229cf0

profile
HELLO THERE

0개의 댓글