Vue를 알아야 한다. - 설치 & 세팅

Jaemin Jung·2022년 1월 14일
0

Vue.js

목록 보기
2/7
post-thumbnail

Vue 설치

Vue를 설치하기 이전에 Node.js 최신 버전으로 설치하는걸 권장한다.
강의에서는 14.16.0 버전을 사용하기에 나는 기존 버전 그대로 사용했다. (v14.17.5)
새로운 디렉토리를 하나 생성후 다음 명령어로 Vue를 설치 해준다.
npm install -g @vue/cli 입력 후에 Vue 3 버전을 방향키 + 엔터로 선택
설치 도중 에디더 부가 기능을 설치해주자

Extensions

  • Vetur: vue 파일의 코드 하이라이팅을 위해서 사용합니다. (각 코드별로 컬러 적용)
  • Vue 3 snippets: vue 파일의 코드 자동완성을 위해서 사용합니다.
  • HTML CSS Support: HTML문서에 적용되어 있는 CSS를 추천해주는 기능입니다.

프로젝트 생성 및 로컬 실행

명령어vue create 프로젝트명 입력하면 하위 폴더로 프로젝트 폴더가 생성된다.
프로젝트 폴더에는 React처럼 src, public등의 폴더들이 구성 되어있고,
App.vue 파일에서 컴포넌트를 조합하여 사용한다.
로컬 실행 명령어는 npm run serve를 입력한 뒤, 출력된 링크를 들어가면 된다.

profile
내가 보려고 쓰는 블로그

0개의 댓글