TIL (Today I Learnd)

SCSS(SASS)

• CSS 의 전처리기 ➡️ 컴파일 (Compile) 해서 사용
  • CSS 를 더 편리하고 멋지고 쿨하게 전처리기로 작성 가능
    
    
• 선택자의 변수지정, 중첩, 반복문, 조건문 사용가능
  
  
• SASS 와 간단한 문법 차이는 세미콜론 ( ; ), 중괄호 ( {} ) 의 유무
  
  
• VScode 사용시 비교적 쉽게 컴파일 가능
  • Extension : Live Sass Compiler
    
  
  
• & : 상위 선택자 a ➡️ &:hover === a:hover
  
  
• @mixin @include , %변수명 @extend 사용법과 차이
  
  
• 인자 사용 가능 @mixin 변수명($param, $param) { }
  
  
  

TEL (Trial and Error Log)

• VScode 확장자 *.scss , 컴파일 과정은 비교적 간단함
  
  
• 아직 익숙하지 않으나 확실히 작성하는데 있어 불필요한 문법낭비를 줄일 수 있으며 편하다.
  
  
  • 간혹 문법의 오류, 익숙해지도록 자주 사용 앞으로는 SCSS 로만 사용하기
    
    
  • SCSS(SASS) Lint 사용법
    
    
• Compilation Error
  Error: Invalid CSS after "h1 {": expected "}", was "{" on line 4
  
  
  • *.sass 에 SCSS 문법대로 작성하고 컴파일 하니 에러