Vue 설치하기
- node 설치 (url)
- 최신 or 최신 LTS 버전 아니면 에러남
- 윈도우/맥 똑같이 설치하면 됨
- 다른 경로에 설치 하면 안됨
- vscode 검색 후 설치
- vscode에서 새 터미널을 열어준다.
- 터미널에
npm install -g @vue/cli
를 입력한다.
- 버전을 정해서 입력하고 싶다면
npm install -g @vue/cli@버전명
을 입력하면 된다.
젠장 설치가 제대로 되지 않는다..
해결방법
- node.js 제거 후 최신버전으로 설치 16 버전에서 18버전 최신으로 변경
실패
- yarn으로 설치해 보기 yarn 1.22 버전
- vscode터미널이 아니라, 직접 관리자 모드로 터미널 실행
vue create [프로젝트이름]
이 앞에도 설정하는 화면이 있었는데 캡쳐하지 못했다, 2버전쓸건지 3버전쓸건지 물어봐서 3버전을 사용한다고 선택했다.
해결
vscode를 실행할때 프롬프트에서 code라고 실행해서 권한에 문제가 있었나보다.. 그냥 관리자 모드에서 실행하니 바로 수월하게 진행되었다.
뷰 실행방법!
4.npm run serve
명령어를 터미널에서 사용하여 제대로 나오는 지 확인하자!
- 로컬에 있는 url에 들어가보면
app.vue
파일에 있는 내용이 잘 출력된다.
6.사실 app.vue
브라우저에서 해석하지 못해서 실제로는 index.html
을 보는거고 app.vue
가 랜더링 되서 index.html
에 보이는 것이다.
- 부가기능 설치
- vetur : vue 하이라이트 위해 설치!
- vue 3 snippets : vue 자동 완성 도구
- html css : html 문서에 적용되어 있는 css를 추천해 주는 기능!