kimminna

  • 홈
  • 태그
  • 방명록

TailwindCSS 1

모노레포에서 미디어 쿼리가 무시되는 이유

모노레포 환경에서 공통 UI 패키지(@repo/ui)를 구축할 때 각 패키지가 독립적으로 스타일을 빌드하게 만든다면, sm:px-10 같은 반응형 클래스가 무시되거나, 스타일 우선순위가 뒤엉키는 'Cascade Conflict'가 발생합니다. 이번 트러블슈팅을 통해 CSS Cascade(계단식 적용) 원리와 Tailwind v4의 빌드 메커니즘, 그리고 모노레포에서의 정확한 경로 설정의 중요성을 알아봅니다. 1. 문제 증상상황: packages/ui 내부의 Modal 컴포넌트에 px-5.25 sm:px-10.75를 적용함.현상: 화면 너비가 640px(sm) 이상임에도 불구하고, 개발자 도구에서 sm:px-10.75에 취소선이 그어지고 px-5.25가 최종 적용됨.특이사항: sm:!px-10.75..

프론트엔드 2026.03.02
이전
1
다음
더보기
  • 분류 전체보기 (8)
    • 프론트엔드 (7)
    • 동아리 (1)

Tag

Cotato, TailwindCSS, 모노레포, ZOD, 미디어쿼리, 모달 컴포넌트, 코테이토, 웹 접근성, IT 연합 동아리, storybook, 디자인시스템, use-funnel, 프론트엔드, 프로젝트 구조, url 상태, 스토리북, next.js, tanStack Query, 마이그레이션,

최근글과 인기글

  • 최근글
  • 인기글

최근댓글

공지사항

페이스북 트위터 플러그인

  • Facebook
  • Twitter

Archives

Calendar

«   2026/03   »
일 월 화 수 목 금 토
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 31

방문자수Total

  • Today :
  • Yesterday :

Copyright © AXZ Corp. All rights reserved.

티스토리툴바