Vue 초기 세팅

> Vue DevTools

크롬 Vue devtools 설치 (디버깅 편리)

> CLI

Vue CLI 홈페이지를 참조하자

 

Vue.js 개발을 위한 표준 툴

 

Vue 프로젝트를 손쉽게 만들 수 있도록 도와주는 커맨드라인 도구.

 

프로젝트를 Git clone 받은 후

$yarn global add @vue/cli (3버전) // vue CLI 설치
$vue --version // 버전 확인

$yarn (=npm Install)

$yarn serve (=npm start)

---

> Vue Extensions

vscode에서 설치한다.

 

• view-in-browser : html 파일을 기본 브라우저로 볼 수 있도록 한다.
• vetur : Vuew.js 작업시 편리한 기능들을 제공. (코드 자동완성, 디버깅, 하이라이팅 등)
• HTML Snippets : HTML 태그를 빠르게 작성할 수 있게 도와줍니다.
• Vue 3 Snippets : Vue.js 3.0의 코드 지원 및 하이라이팅 기능을 제공.
• Vue-beautify : Vue.js 코드에 대한 정리 배치 기능을 제공.

---

> (참고) 새 프로젝트 시작 시

vue create 프로젝트명 명령어로 프로젝트를 생성.

$vue create 프로젝트 명
? Please pick a preset: (Use arrow keys)
default (babel, eslint)
  Manually select features

 

버전 확인 후, default로 설정하고 넘어간다.

$cd 프로젝트 명

$yarn serve