[SASS] 사용전 준비

Sass 컴파일에 관하여

Sass는 컴파일러 없이는 작동하지 않는다.

그렇기때문에 어플리케이션 방식이나 커맨드라인 방식을 사용하여 컴파일 과정을 거쳐야한다.

1-1. 어플리케이션 방식

어플리케이션 방식은 SASS 공식 홈페이지에 들어가면, 어플리케이션에 대한 정보를 더 자세히 확인할 수 있다.

어플리케이션 중에서는 Koala를 사용해봤는데, 간편하고 무료 + 모든 플랫폼에서 작동한다는 장점이 있다.

1-2. 커맨드라인 방식

커맨드라인을 통해서 컴파일하기 위해서는 OS에 "RUBY, 루비"라는 프로그래밍 언어가 설치 되어 있어야한다.

루비를 설치한 후에는 커맨드 창을 열고 gem install sass 라고 입력후 엔터를 쳐준다.

설치가 다 되었다는 메세지를 확인한 후엔 sass -v를 입력해 한번 더 버전을 확인해본다.

1-3. 컴파일 하는 방법

1-3-1. 한개의 파일 컴파일

sass input.scss output.css

앞이 컴파일 하는 scss파일이고, 뒤에가 컴파일 후 생성되는 파일이다.

매번 컴파일을 할 수 없기에, 자동으로 컴파일 되도록 설정할 수 있는데,

sass --watch input.scss:output.css

이렇게 하면, scss 파일이 변경될 때 마다 자동으로 css파일을 생성한다.

scss파일과 css파일이 담긴 폴더가 다르다면, 앞에 경로를 써주면 된다.

1-3-2. 폴더 컴파일

하나의 파일 뿐 아니라, 폴더 대상으로도 컴파일을 걸 수 있는데,

sass--watch sass/:css

이렇게 하면 현재 폴더에서 sass 폴더 안의 모든 .scss 파일을 css/ 폴더 하위에 경로를 맞춰 컴파일 된다는 의미다.

1-3-3. 컴파일 스타일

css로 출력 되었을때 나오는 스타일을 설정할 수 있다.

sass --watch --style compact sass/:css

아웃풋 스타일에 대한 옵션은 따로 링크를 걸어둔다.

Compass를 통한 컴파일도 있는데, 이 부분에 대해서는 더 공부를 해야할 것 같다.