Tailwind CSS에서 동적 클래스가 빌드 후에 적용이 안 됩니다

Tailwind은 빌드 시 정적 분석으로 사용된 클래스만 추출합���다. 동적으로 조합된 문자열은 감지하지 못합니다.

// ❌ 안 됨 — 빌드 시 감지 불가
const color = 'red'


// ✅ 방법 1: 전체 클래스명 사용
const colorClass = {
  red: 'bg-red-500',
  blue: 'bg-blue-500',
  green: 'bg-green-500',
}


// ✅ 방법 2: safelist에 등록
// tailwind.config.js
module.exports = {
  safelist: ['bg-red-500', 'bg-blue-500', 'bg-green-500']
}

규칙: Tailwind 클래스는 항상 완전한 문자열로 작성하세요.