SCSS 설치 및 진행방법 (Install & Preprocessing)

Scss / Sass v1.0 </doc>

jeongah story.co.kr

SCSS

Sass(syntactically awesome stylesheets, 사스)는 스타일시트 언어입니다.

Sass는 종속형 시트(CSS)로 해석 및 컴파일되는 스크립트 언어입니다. SassScript는 그 자체로 스크립트 언어이다. Sass는 2가지로 구성되어 있습니다. 새로운 "SCSS"는 CSS의 것과 비슷한 블록 형식을 사용합니다. 블록 안의 줄을 구불하기 위해 괄호를 사용하여 코드 블록과 세미콜론을 인지합니다.

SCSS 설치

Sass는 단독으로 설치 가능한 애플리케이션이 아닌, 루비온레일스(Ruby On Rails)라는 오픈 소스 웹 프레임워크에 속한 패키지 프로그램이기 때문입니다. 먼저 루비를 설치하고 그다음 Sass를 설치합니다.

루비 사이트 가기

설치 방법

1. https://rubyinstaller.org/downloads/ 홈페이지 이동 > Ruby+Devkit 2.6.1-1 (x64) 설치
2. 설치후 압축파일 해제
3.설치 후 파일을 열어서 1을 누른후 enter를 치고 기다립니다.
4. 설치가 완료되면 시작> 명령 프롬프트를 엽니다.
5. ruby –v를 타이핑 후, enter를 치고 설치를 기다립니다.
6. 설치가 완료되면 gem install sass를 입력하고 엔터키를 누르면 설치가 완료되니다.
sass 홈페이지에서 Sass Basics내용 참고 sass 홈페이지

Preprocessing

1. local에 있는 css에 폴더에서 reset.css/ style.css (.css 가 없을시 확장자명 보기로 합니다.
2. (옵션>폴더 및 검색 옵션 변경 >보기 > 알려진 파일 형식의 파일 확장명 숨기기 체크를 풀고 적용합니다.)
3. style.css를 style.scss로 확장자명을 바꾼후
4. 명령 프롬프트에 cd C:\Users\hi\Desktop\smartweb\html\mobile\jesindex\assets\css
5. (cd 경로)치고 엔터를 누릅니다.
6. sass style.scss style.css 타이핑 후 엔터를 누르면 준비완료가 됩니다. (아래는 최종 화면입니다.)