컴포넌트 라이브러리 비교
lh-ui-plus와 다른 주요 Vue UI 라이브러리의 비교 분석입니다.
핵심 비교
| 특성 | lh-ui-plus | Element Plus | Ant Design Vue | Naive UI |
|---|---|---|---|---|
| 스타일 방식 | CSS 변수 | SCSS 변수 | CSS 변수 (Less token) | CSS 변수 |
| 다크 모드 | ✅ | ✅ | ✅ (테마 token) | ✅ |
| 문양 배경 | ✅ 6가지 | ❌ | ❌ | ❌ |
| 크로스 프레임워크 | ✅ 순수 함수 로직 | ❌ | ❌ | ❌ |
| 국제화 | ✅ zh/en 완비, 나머지 언어 패은 자리 표시 | ✅ | ✅ | ✅ |
| sx 레이아웃 | ✅ | ❌ | ❌ | ❌ |
| PassThrough | ❌ | ❌ | ❌ | ❌ (테마 덮어쓰기) |
| BEM 네이밍 | lh- | el- | ant- | n- |
고유한 장점
- 중국풍 디자인 시스템 — 중국 전통 안료에 기반한 색채 구성
- CSS 변수 테마 (88+ 토큰) — SCSS보다 유연한 업데이트
- 크로스 프레임워크 — 순수 함수 로직으로, 향후 React에도 적용 가능
- 문양 배경 시스템 — 전통 SVG 텍스처 배경
- sx 빠른 레이아웃 — Tailwind와 유사한 원자화된 인라인 스타일
선택 가이드
- 중국풍 디자인 / 문양 배경이 필요 → lh-ui-plus
- 다크 모드가 필요 → 네 가지 모두 가능
- 크로스 프레임워크 지원이 필요 → lh-ui-plus (컴포넌트 로직이 프레임워크에서 분리됨)
- 완성된 생태계와 엔터프라이즈급 폼이 필요 → Element Plus / Ant Design Vue
- 테마의 깊은 덮어쓰기가 필요 → Naive UI (theme overrides)