캐모마일 UI Component 모듈 사용법 및 가이드

개요

ChmmVue는 PrimeVue 기반의 UI Component 라이브러리입니다.

주요 특징

1. 확장된 컴포넌트

   • PrimeVue의 기본 컴포넌트를 확장하여 추가적인 기능과 스타일을 제공.

2. 모던 디자인

   • 최신 디자인 트렌드를 반영한 UI 컴포넌트

   • 사용자 경험(UX)을 고려한 직관적인 인터페이스.

3. 테마 및 스타일링

   • 다양한 테마 옵션 제공.

   • 사용자 정의 가능한 스타일링 시스템으로 브랜드 일관성 유지.

4. 문서화 및 예제

   • 상세한 문서화와 다양한 사용 예제 제공.

   • 개발자들이 쉽게 이해하고 사용할 수 있도록 가이드라인 제공.

사용법

1. 설치

   • repository 설정

   // .npmrc 파일 registry=http://10.131.7.138:9090/repository/npm-public/

   • 라이브러리 추가

   npm i chmmvue --save-dev

2. 설정

   // nuxt.config.ts 파일 export default defineNuxtConfig({ ... build: { transpile: [ 'chart.js', 'chmmvue', ], }, ...

3. 사용

   // .vue 파일 <template> <div> ... <ChmmVInput id="userId" v-model.trim="user.userId" :required="true" :disabled="true" pattern="text" :min-length="5" :max-length="50" :autofocus="true" :submit="submitted" @validate="validateData[0] = $event" /> ... </div> </template>

플레이그라운드

플레이 그라운드 URL 접속