Vue 프로젝트 매니저 + Vuetify 설치

두별·2022년 2월 24일
0

Vue

목록 보기
3/3

vue ui 실행 및 프로젝트 생성

PS D:\TIL> vue ui

터미널에서 vue ui를 실행하면 8080포트에서 Vue 프로젝트 매니저를 사용할 수 있다.

https://www.youtube.com/watch?v=R6NmDe-TDBY&list=LL&index=1
위 영상을 참고하여 프로젝트를 생성한다.

셋팅시 주의할 점 !
vuetify는 vue3 지원하지 않는다. vue2를 사용할 것.
vue3를 사용하면 vuetify 플러그인 설치하는 도중
ERROR Error: You cannot call "get" on a collection with no paths. Instead, check the "length" property first to verify at least 1 path exists.
이런 에러가 발생한다.
https://github.com/vuetifyjs/vue-cli-plugins/issues/140

vue3으로 셋팅하는 바람에 몇번 삽질 후

PS D:\TIL> vue ui
🚀  Starting GUI...
🌠  Ready on http://localhost:8000
Auto cleaned 1 projects (folder not found).

🎉  Preset vue2 saved in C:\Users\user\.vuerc

126 packages are looking for funding
  run `npm fund` for details

10 moderate severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.
⚓  Running completion hooks...
PS D:\TIL> cd .\vuetify\        
PS D:\TIL\vuetify> npm run serve

정상적으로 실행 완료
혹시라도 css가 안먹고 컴포넌트들이 하얗고 까맣게 나온다면

이렇게 컴포넌트를 v-app 태그 안에 넣어주면 된다.

0개의 댓글