vue 를 이용하여 새 프로젝트를 생성해보도록 하겠습니다. 😆
vue 프로젝트 생성하기
1. vue-cli 설치
https://cli.vuejs.org/guide/installation.html
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
'🧶 𝗪𝗲𝗯 > Vue' 카테고리의 다른 글
[to-do-app] TodoInput 컴포넌트 구현 (0) | 2022.02.23 |
---|---|
[to-do-app] TodoHeader 컴포넌트 구현 (0) | 2022.02.23 |
[to-do-app] 파비콘, 아이콘, 폰트, 반응형 태그 설정하기 (0) | 2022.02.23 |
[to-do-app] Vue 컴포넌트 생성 및 등록 (0) | 2022.02.23 |
[to-do-app] Vue 환경설정 (0) | 2022.02.21 |