vscode php scss 사용하기 sass 컴파일러 설치

✈ vscode php scss 사용하기 sass 컴파일러 설치.

처음 vscode를 사용했을 때는 앵귤러를 사용했기 때문에, scss를 기본으로 사용했었다.

얼마 전에 php 프로젝트에 scss를 사용하려고 vscode scss설치를 했다.

기본적으로 브라우저 자체가 scss를 이해하는 것이 아니기 때문에 scss는 sass compiler로 컴파일해서 css파일을 생성해 주어야 한다.

어디까지나 scss는 퍼블리셔의 편의를 위한 기능이지 브라우저를 위한 기능이 아니기 때문이다.

vs코드에서 scss를 사용한다는 것은 사용 언어와 무관하게 사용될 수 있다.

바로 Live sass compiler를 설치함으로써 가능하다.

sass Lint 익스텐션 설치

설치하는 김에 sass Lint 익스텐션도 설치하면 편리하다.

vscode sass 설치

sass도 당연히 설치.

컴파일 과정에서 당연하게도. map파일이 생성된다.

이 맵파일은 딱히 기능적으로 하는 역할은 없다.

미래에는 있을지 모르겠지만, 대체로 개발자들이 디버깅할 때 사용하는 파일이다.

이 파일을 생성하지 않으려면 https://nm817.tistory.com/37 블로그 포스팅에서 확인하기 바란다. 

컴파일이 성공하면

작업표시줄에 Success가 뜬다.

실패하면 빨간색 Error와 함께 에러 위치가 Output에 표시된다.