.

1. Vue.js 설치 및 프로젝트 생성

 

1-1) Vue.js 프로젝트를 생성할 Workspace 폴더를 지정한다.

cmd창을 열어 해당 Workspace 폴더에 vue-cli를 설치한다. 

- npm install –g vue-cli

 

1-2) vue-cli를 설치 후 vue 프로젝트를 생성한다.

- vue init webpack vueclient #vue webpack

프로젝트 정보 및 추가기능 유무를 입력하는 항목이 나온다.

- Vue-router web 통신을 하는데 필수적인 요소이므로 Yes를 선택한다.

- ESLint는 공통 개발을 할 때 코드의 가독성을 높여주는 기능이다. ESLint는 코드의 들여쓰기나

공백 등을 검사 해주는 기능이다.

- unit-tests는 단위검사로 Vue의 컴포넌트를 테스트할 때 사용된다.

- Nightwatch는 각종 브라우저를 조작하고 동작이 기대한 것과 일치하는지 테스트할 때 사용된다.

- 사실상 Vue-router 기능이 핵심이므로 Vue-roter는 함께 설치하도록 한다.

 

- 설치 후 해당 프로젝트로 이동하여 프로젝트를 실행.

- cd vueclient

- npm run dev

 

1-3)localhost:8082에 접속한다.

- 다음과 같은 페이지가 나오면 프로젝트를 성공적으로 생성하였다.

 

Vue.js 의 기능과 추가 설명은 추후에 진행하겠습니다.

+ Recent posts