Vue.js

Vue.js CLI

아이스올리 2024. 4. 30. 18:00

Vue.js CLI란?

- Vue.js 애플리케이션의 개발 환경을 설정하고 관리하기 위한 커맨드 라인 도구.

- 프로젝트를 빠르게 시작하고, 번들링, 테스팅 및 배포등의 작업을 쉽게 처리 가능.

- 프로젝트에 필요한 라이브러리와 도구 등을 자동으로 설치하고 구성가능.

 

Vue.js CLI 설치

- 먼저 CLI를 설치하기 위해서는 node.js가 설치가 되어 있어야 한다. 따라서 아래의 주소에서 사용자의 환경에 맞게 설치.

https://nodejs.org/en

 

Node.js — Run JavaScript Everywhere

Node.js® is a JavaScript runtime built on Chrome's V8 JavaScript engine.

nodejs.org

 

- node.js를 설치하였다면 그 다음으로 명령프롬포트를 실행시켜 아래와 같이 입력.

install -g @vue/cli

 

- 위와 같이 정상적으로 설치가 완료되었다면 아래와 같이 입력하여 확인해 보자.

vue --version

 

- 설치확인인 끝났다면 다음으로는 아래의 명령어를 통하여 Vue.js 프로젝트를 생성해보자.

vue create [프로젝트명]

 

- 다음으로 프로젝트 생성 구성을 설저하여 보자 아래의 그림과 같이 나왔다면 3번째의 "Manually select features"를 

키보드 방향표를 이용하여 선택 후 엔터

 

- 아래와 같은 화면이 출력되었다면 원하는 구성을 키보드 방향표를 통하여 이동 후 스페이스를 통하여 선택 후 엔터.

 

- 여러가지 선택 사항이 출력되는데, 원하는 구성에 맞게 선택 후 계속 엔터를 누르자.

 

- 원하는 구성을 선택 후 정상적으로 생성이 되었다면 아래와 같이 출력된다.

 

- 마지막으로 제대로 생성이 되었는지 확인.

 

- 확인이 되었다면 컴파일 프로그램을 통하여 생성된 파일을 열어보자.

 

- 정상적으로 설치되었다는 것을 확인할 수 있다.