SASS의 정의, 사용방법

1. SASS 란

SASS (Syntactically Awesome Style Sheets)

CSS의 코드를 재활용성과 가독성을 높여 효율적이게 해준다.

2. SCSS 란

SCSS - SASS의 3버전 부터 등장하여 CSS의 문법을 따라가 CSS를 하던 개발자라면 쉽게 코딩 할 수 있게 만들었다.

3. SASS 사용 방법

SASS 코드 작성 -> SASS 파일을 CSS파일로 컴파일 -> CSS 변환

4. 컴파일 방법

(1) 웹페이지 실시간 변환

(2) node-sass

(3) 개발도구 확장 프로그램

웹페이지 실시간 변환

웹페이지 접속 > 왼쪽 코드 입력 > 오른쪽 반환

node-sass

node.js 설치

npm install -g node-sass

$ node-sass [옵션] [scss파일] [반환css파일경로]

$ node-sass -w scss_test/main.scss css_test/main.css