Vue.js 설치, 프로젝트 생성

2022. 11. 7. 09:55Vue.js

반응형

1. node.js 설치 후 환경변수에 넣어준다

2. VS code 설치해서 연다.

3. 작업하려는 폴더를 연다

3. 터미널 창을 열고 작업 폴더로 이동 (cd 작업폴더 위치 )

4.

npm install -g  vue 명령어로 설치

npm install -g @vue/cli 명령어를 입력해서 CLI설치

맥북 사용하는 사람들은 앞에 sudo 추가해서 입력

vue --version으로 설치되었는지 확인 가능

5. vs code에서 Vetur 설치

 Syntax-Highlighting, Erro Checking, Formatting, Debugging, Auto Completion 등 원활한 코딩을 위해 도움을 준다

6. 프로젝트 생성

vue create 프로젝트이름 누르고 엔터 누르면

  Default ([Vue 3] babel, eslint) 
> Default ([Vue 2] babel, eslint) 
  Manually select features 

이런식으로 어떤식으로 vue 프로젝트를 생성할지 선택한다. 아직까지 Vue2를 많이 씀

Manually select features로 생성하면 일일이 하나하나 설정해서 프로젝트 생성가능

 

프로젝트를 생성하면

 cd 프로젝트 이름
 npm run serve

이런 메세지가 뜨는데 위의 명령어를 차례대로 입력하면 된다.

http://localhost:8080/ 

에 들어가서 vue 페이지가 나오면 프로젝트 생성이 완료 된거다.

vue 실행을 취소하려면 ctrl  +  c 키로 나올 수 있다.

 

 

 

 

 

 

 

 

반응형

'Vue.js' 카테고리의 다른 글

Vue.js 라우터  (0) 2022.11.08
Vue.js - 프로젝트 수동 생성  (0) 2022.11.07
Vue.js - main.js 설명  (0) 2022.11.07
Vue - package.json 설명  (0) 2022.11.07