CSS Modules는 작성한 이름을 파일별 고유 class로 바꾼다

사람은 styles 객체를 사용하고 빌드는 충돌 없는 실제 class 이름을 DOM에 연결한다.

1

Module file

Button.module.css에 지역 class 정의

2

Import

컴포넌트가 styles.primary 속성으로 참조

3

Build

파일·class·hash를 조합한 고유 이름 생성

4

DOM

다른 모듈의 같은 이름과 충돌 없이 적용

핵심전역 reset과 토큰은 global CSS에 남기고 컴포넌트 시각 규칙은 모듈 경계로 좁힌다.