뷰 CLI

뷰 개발자들이 편하게 프로젝트를 구성할 수 있도록 뷰 코어 팀에서 CLI 도구를 제공

CLI 설치를 위해선 node.js가 설치되어 있어야 한다.

 

커맨드 창에 입력

npm install vue-cli -global

테스트로 vue를 입력하면 아래처럼 뜬다.

초기 구성을 위한 명령어(vue init)

vue init webpack // 고급 웹팩 기능 활용한 구성 방식. 테스트, 문법 검사 등 지원
vue init webpack-simple // 웹팩 최소 기능을 활용한 프로젝트 구성 방식. 빠른 화면 프로토타이핑용
vue init browserify // 고급 브라우저파이 기능 활용한 구성 ㅂ아식, 테스트, 문법 검사 등 지원
vue init browserify-simple // 브라우저리파이 최소 기능을 활용한 프로젝트 구성 방식. 빠른 화면 프로토타이핑용
vue init simple // 최소 뷰 기능만 들어간 HTML 파일 1개 생성
vue init pwa // 웹팩 기반의 프로그레시브 웹 앱 기능을 지원하는 뷰 플젝

 

* vue 파일 방식으로 어플리케이션을 개발하려면 뷰 로더와 이를 지원하는 웹팩, 브라우저리파이 같은 모듈 번들러가 필요. 

 

프로젝트 생성해보기

원하는 폴더로 가서 다음과 같은 명령어 입력

npm install

다음과 같은 파일들이 설치된다.

npm run dev

위 명령어를 실행하고 localhost:8081로 접근하면 다음과 같이 뜬다(8080은 다른거 사용중)

 

뷰 로더

뷰 로더는 웹팩에서 지원하는 라이브러리이다. 뷰 로더는 .vue 파일을 브라우저에서 실행 가능한 웹 페이지의 형태로 변환해준다. 웹팩은 자바스크립트 모듈만 인식하기 때문에 뷰 로더가 vue파일을 일단 자바스크립트 모듈로 변환한다.