hoony's web study

728x90
반응형

이번 프로젝트는 vue3를 사용하기 위해서 어쩔수 없이 제가 좋아하는 vuetify titan을 사용해야 했습니다.
이번 포스팅의 대표이미지를 보시면 제가 로컬에서 띄운 화면을 캡쳐한 것입니다.
어떤 프로젝트라도 처음 셋팅하고 만드는 것이 어렵네요. 

vuetify titan 버전은 vue/cli 5.0 으로 생성을 해야만 정상적으로 생성이 되네요. 
이전 포스팅에서 제가 vue/cli update 하는 방법은 알려드렸습니다.
https://islet4you.tistory.com/entry/VUEJS-Vue-CLI-최신-버전으로-업데이트-하기

 

[VUEJS] Vue CLI 최신 버전으로 업데이트 하기

이전 포스팅에 보면 업데이트를 하는 링크를 달아 드렸는데요. 제가 해서 업데이트를 성공한 것을 포스팅해드립니다. 아래와 같이 하니 업데이트가 잘 되더군요. npm update -g @vue/cli 위의 예시처

islet4you.tistory.com

그럼 프로젝트 생성 방법을 한번 살펴 보겠습니다.
vue/cli 5.0이라는 조건으로 셋팅한 것입니다.

1. vue project 생성 

vue create my-app

2. vuetify 추가 
    cd my-app 로 이동하시구요. 
    아래와 같이 실행을 해주세요. 

vue add vuetify

3. Vuetify 3 Preview(Vuetify 3)를 선택해주세요.

반응형


4. 실행 

npm run serve


제가 보고 싶었던 화면이 짠하고 나온답니다.

vue3를 진행하면서 이전 포스팅에서는 안 해봤던 것이나 새로운 것을 또 알아가야할 일만 남은것 같습니다. 

포스팅이 도움이 되셨다면 공감부탁드립니다. 

728x90

공유하기

facebook twitter kakaoTalk kakaostory naver band
loading