vuejs-ai/vue-tui

해결하는 문제

vue-tui는 인터랙티브한 터미널 사용자 인터페이스(TUI)를 구축하기 위해 설계된 Vue 네이티브 애플리케이션 프레임워크입니다. 개발자들은 현대 웹 개발에서 사용하는 컴포넌트 기반 아키텍처와 반응형 상태 관리를 사용하여 복잡한 터미널 앱을 만들 수 있으며, 수동으로 터미널 이스케이프 코드를 관리하거나 저수준 화면 그리기 작업을 처리할 필요가 없습니다.

작동 방식

이 프레임워크는 Vue 3용 커스텀 렌더러를 제공하여 Vue 컴포넌트를 터미널 출력으로 변환합니다. React Native에서 사용하는 것과 동일한 Yoga 레이아웃 엔진을 사용하여 터미널에서 Flexbox 레이아웃을 구현합니다. 개발자는 Vue 단일 파일 컴포넌트(SFC) 또는 JSX/TSX로 인터페이스를 작성할 수 있으며, 프레임워크는 전용 컴포저블과 컴포넌트를 통해 렌더링, 입력 처리, 포커스 관리를 처리합니다.

대상 사용자

Vite 플러그인을 통한 핫 모듈 리플레이스먼트(HMR)와 결정론적 테스트 환경을 포함한 전문적인 개발 경험을 원하는 Node.js 개발자들을 대상으로 합니다.

주요 기능

• Vue 네이티브 워크플로우: 터미널 UI를 구축하기 위한 Vue SFC, JSX, TSX 지원.
• Flexbox 레이아웃: 반응형 터미널 레이아웃을 위한 통합 Yoga 엔진.
• 개발자 경험: @vue-tui/vite를 통한 실험적 HMR 지원으로 즉각적인 터미널 업데이트 가능.
• 포괄적인 도구 세트: 터미널 입력을 시뮬레이션하고 프레임을 검사하기 위한 전용 테스팅 패키지 @vue-tui/testing 포함.
• 풍부한 컴포넌트 라이브러리: <ScrollBox>, <Spinner>, <Table>와 같은 고수준 컴포넌트 제공.
• 입력 처리: 텍스트, 붙여넣기, 키 이벤트 관리를 정규화한 컴포저블 제공.