Hello, Dev World

  • 홈
  • 태그
  • 방명록

cssmodules 1

Vite 스타일링 가이드 ③ - CSS Modules

협업을 하다 보면 클래스 이름이 충돌하는 건 흔한 일이다.이런 문제를 해결해 줄 수 있는 방법이 있다고 해서 한번 알아보려 한다. CSS Modules란?각 CSS파일을 로컬 범위(Local Scope)로 처리해 주는 방식이다.작성한 클래스 이름이 컴포넌트 내부에서만 유효하게 만들어주는 기능이라 생각하면 된다. CSS Modules의 장단점장점스타일 충돌 방지: 클래스 이름이 고유하게 만들어져 전역 스코프 문제를 완벽하게 해결해 준다.모듈성: 컴포넌트와 스타일을 1:1로 관리할 수 있어 유지보수가 쉽다.기존 CSS 문법 사용: 기존에 사용하던 CSS 문법을 그대로 활용할 수 있다.컴포넌트 재사용성 향상: 스타일이 컴포넌트에 종속되므로 컴포넌트를 다른 프로젝트에 가져가도 스타일이 깨지는 일이 없다...

FrontEnd/React 2025.06.27
이전
1
다음
더보기
프로필사진

Hello, Dev World

버그는 잠시, 배움은 영원히

  • 분류 전체보기 (22)
    • FrontEnd (15)
      • HTML (1)
      • CSS (1)
      • React (13)
    • BackEnd (1)
      • C# (1)
    • Git (6)

Tag

timeago, react-router, context api, react, cherry-pick, cssmodules, tanstack query, git, aspect-ratio, axios, tuples, Github, useParams, git cherry-pick, git commit --amend, styled-components, react-query, vite, tailwindcss, useNavigate,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2026/04   »
일 월 화 수 목 금 토
1 2 3 4
5 6 7 8 9 10 11
12 13 14 15 16 17 18
19 20 21 22 23 24 25
26 27 28 29 30

방문자수Total

  • Today :
  • Yesterday :

Copyright © AXZ Corp All rights reserved.

티스토리툴바