[to-do-app] Vue 프로젝트 생성하기
🧶 𝗪𝗲𝗯/Vue

[to-do-app] Vue 프로젝트 생성하기

vue 를 이용하여 새 프로젝트를 생성해보도록 하겠습니다. 😆


 

 vue 프로젝트 생성하기 

1. vue-cli 설치

https://cli.vuejs.org/guide/installation.html

 

Installation | Vue CLI

Installation Warning regarding Previous Versions The package name changed from vue-cli to @vue/cli. If you have the previous vue-cli (1.x or 2.x) package installed globally, you need to uninstall it first with npm uninstall vue-cli -g or yarn global remove

cli.vuejs.org

npm i -g @vue/cli

vue 의 개발 도구의 @vue/cli 를 설치하여 프로젝트를 생성해봅시다.

우선 위의 명령어를 터미널 창에 입력합니다.

 

vue --version

버전을 확인하여 제대로 설치되었는지 확인합시다. 버전이 올바르게 나온다면 설치가 완료된 것입니다.

 

 

2. vue 프로젝트 생성

cd (설치하려는 폴더 위치)

vue 프로젝트를 설치하려는 위치로 cd 명령어를 통하여 이동합니다.

 

vue create (프로젝트 이름)

vue create (프로젝트 이름) 으로 프로젝트를 만듭니다.

프로젝트 이름은 소문자로 시작해야 합니다. 대문자로는 만들어지지 않습니다. 유의하시길 👈

 

이렇게 어떤 preset을 선택할지 묻는데 [Default] 를 선택하고 엔터키를 누릅니다.

(여기서 본 프로젝트는 Vue 3말고 Vue 2를 선택했습니다.)

 

그러면 이런식으로 vue-todo 폴더가 만들어지며 안에 vue 프로젝트가 등록된 것을 확인할 수 있습니다.

 

 

3. 로컬서버에서 vue 실행하기

npm run serve

해당 명령어를 입력하면 localhost:8080 에서 해당 페이지가 뜹니다.

저렇게 페이지가 뜨면 프로젝트 만드는 것에 성공한 것입니다 ! ✨

 

 

 

 

 

 

Vue 프로젝트 생성

vue-cli 사용법

vue-cli 프로젝트 생성


 

728x90