Angular cli 에서 scss sass 사용하는 법

angular cli 프로젝트를 생성하면 기본 style 형식이 css 로 설정된다. scss 나 sass 를 사용하려면, 프로젝트 생성단계에서 style옵션을 추가해주어야한다. 기존 프로젝트에서 scss 또는 sass를 사용하려면 node-sass 를 설치하고 angular-cli.json 파일을 수정해주면 된다.

새 프로젝트 생성

//SASS 사용시
$ ng new project --style=sass
//SCSS 사용시
$ ng new project --style=scss

 

기존프로젝트에 sass / scss 추가하기

//node-sass 설치
$ npm install node-sass --save-dev

 

//명령프롬프트를 이용한 기본 style 형식 설정
$ ng set defaults.styleExt sass
[or]
$ ng set defaults.styleExt scss

 

//angular-cli.json 수정을 통한 기본 style 형식 설정
"defaults": {
     "styleExt": "sass",
}
또는
"defaults": {
     "styleExt": "scss",
}

 

댓글 남기기