Vuetify2 [Nuxt] Nuxt3 + Vuetify 환경에서 vee-validate + yup으로 입력값 검증하기 개요 프론트에서도 입력값에 대한 검증을 하기 위해 vee-validate와 yup을 사용했습니다. vee-validate는 vue.js에서 form validation을 편하게 해주는 도구입니다. yup은 유효성 검사를 위한 스키마 빌더입니다. vuetify가 기본으로 제공하는 rules로도 유효성 검사를 할 수 있지만 일일히 rules를 만들기 복잡하고 관리하기 어렵기 때문에 vee-validate와 yup을 통해 유효성 검사를 간편하게 해보겠습니다. 기본적인 사용법과 vuetify랑 같이 사용하는 방법을 알아보겠습니다. 환경 "devDependencies": { "nuxt": "^3.0.0-rc.6" }, "dependencies": { "@mdi/font": "^6.9.96", "axios": "^.. 2022. 8. 10. [Nuxt] Nuxt3에서 Vuetify + mdi 사용하기 Vuetify Vue.js 기반의 UI 프레임워크다. Material Design Spec에 따라 개발되었다. 현재 2.x.x 버전은 Vue3를 지원하지 않기 때문에 Nuxt3에서는 Vuetify 3버전 이상을 사용해야 한다. 아래 설정한 내용은 Github에서 확인할 수 있다. Vuetify 설치 sass와 vuetify 최신 버전을 설치해야 한다. yarn add vuetify@next sass 설치를 하고 나면 package.json파일이 아래와 유사한 형태가 될 것이다. { "private": true, "scripts": { "build": "nuxt build", "dev": "nuxt dev", "generate": "nuxt generate", "preview": "nuxt preview".. 2022. 7. 7. 이전 1 다음