CSS 마이그레이션 전략
점진 마이그레이션 권장. 신규는 Tailwind, 다음으로 핫 패스, 레거시는 교체까지 유지.
스타일시트 전체를 한 번에 다시 쓰는 방식은 대개 실패합니다. 새 컴포넌트를 Tailwind로 작성하고, 사용량이 많은 화면을 그다음에 옮기며, 기존 CSS는 대체될 때까지 남겨 두세요. 단계적 절차와 점검 목록을 정리합니다.
컴포넌트 단위 strangler
옛 CSS가 살아 있는 동안 새 UI를 유틸리티화하세요. 해당 컴포넌트 시각 QA 후에만 CSS를 지우세요.
프리미티브 우선
페이지 레이아웃보다 버튼·input·card를 먼저. 디자인 시스템 이중 작업을 줄입니다.
완료 정의
두 너비, 상호작용 상태, 고아 CSS 제거, 임의값은 티켓에 근거.
사용해보기
.example { display: flex; gap: 1rem; padding: 1rem; }신뢰 메모: 결과를 시각적으로 확인하세요. 변환기는 초안용 도우미입니다.