Sass 스타일 계층
변수, mixin, partial을 도입할수록 어느 규칙이 전역 토큰이고 어느 규칙이 컴포넌트 구현인지 분리해야 합니다.
분리
컴포넌트, 레이아웃, 유틸 성격을 파일 단위로 나눠 import 흐름을 단순하게 둡니다.
중첩 제한
DOM 구조를 그대로 깊게 중첩하면 재사용과 override가 어려워집니다.
모듈 결합
SCSS Module은 Sass 기능과 로컬 스코프를 함께 줍니다.
반복 규칙이 줄고 새 테마나 breakpoint를 한 곳에서 바꿀 수 있습니다.
중첩 깊이가 늘고 실제 선택자 우선순위를 추적하기 어려워집니다.
Sass는 CSS를 더 복잡하게 쓰는 도구가 아니라 반복되는 스타일 결정을 명시적으로 모으는 도구입니다.