vue.js는 자바 스크립트 프레임 워크 중 하나이며 단일 페이지 응용 프로그램 작성 등을 위해 도입됩니다.
VueCLI는 vue.js에서 개발을위한 도구입니다.
대규모 개발이 되면 이러한 툴이 있는 편이 좋은 것 같습니다.

Node.js 설치

JavaScript 환경인 Node.js를 공식 페이지에서 인스톨 한다.
Node.js의 패키지 관리 도구인 npm을 사용할 수 있게 된다.

VueCLI 설치

여기에서는 터미널에서 조작한다. (이번에는 bash를 사용.)
방금 사용할 수 있게 된 npm 명령에 의해 VueCLI를 도입한다.

$ npm install -g @vue/cli 

-g 는 , 글로벌 인스톨로 하기 위한 선언으로 , 인스톨 한 패키지를 어느 디렉토리로부터에서도 실행할 수 (패스를 통과) 할 수 있다.
이것을 붙이지 않고 로컬 인스톨 했을 경우, 커런트 디렉토리에 패키지가 놓여져 런타임시에 패스의 지정이 필요하게 된다.
실행 환경에서 경로가 통과되지 않은 경우를 생각하면 로컬 설치로 하는 것이 좋다는 생각도 많이 있으므로 상황에 따라 선택한다.

vue 프로젝트 만들기

설치가 완료되면 vue 명령을 사용할 수 있습니다.
프로젝트를 만드는 다음 명령을 실행합니다.

$ vue create {プロジェクト名}

설정 옵션이 표시되므로 필요한 것을 선택하고 enter를 누릅니다.


이 밖에 중국 국내에서 사용할 수 있도록 taobao와의 접속을 유효하게 하는 옵션도 표시되는 일이 있는 것 같다.

개발 서버 시작

개발을 시작할 수 있다.
개발중인 페이지를 확인하기 위해 다음 명령을 사용하여 개발 서버를 시작합니다.

$ npm run serve

localhost:8080에서 페이지를 확인할 수 있으므로 브라우저에서 액세스하자.
프로젝트의 소스에 변경이 있으면 이 페이지에도 순차적으로 반영된다.