vue.js 개발환경 셋팅

1. 개발환경 셋팅 node.js설치

https://nodejs.org/en/

node.js 왼쪽꺼 설치 최신버전으로 할것! 안그럼 에러 날 수 있다.

기본경로 설치 

 

2.  node.js를 설치하고 명령프롬프트 창에서 node.js가 잘 설치 되었는지 npm 명령어를 실행해 본다. 

만약 실행이 안될경우 재부팅후 재시도

3. cmd창 에서 npm을 이용해 vue cli를 설치한다

 npm install -g @vue/cli

3. cvue cli 설치 후 프로젝트 폴더 만들기

vue create 프로젝트명

 

4. Vue 3에 Default가 잡혀져 있는걸 확인, 설치할 버전을 선택한 후에 엔터

5. 프로젝트 명 찾은후 작업할 디렉토리 위치로 이동 

C:\Users\Administrator > 프로젝트명

 

2.VScode에디터 설치

비쥬얼스튜디오코드 설치

https://code.visualstudio.com/

1. 작업할 폴더 만들고 > 아까cvue cli 설치한 폴더 끌어와서> 에디터 에서 오픈 하면 설치 잘 된거 확인

2.  에디터 상단 Terminal- New Terminal 클릭

4. 터미널 창에 입력 > 디렉토리 경로 잡기

cd kcvue

5. 서버 스타트해서 뷰단이 잘 나오는지 확인

npm run serve

6. Local  에 있는 주소를 웹브라우저 입력창에 입력해서 잘 뜨는지 확인

나의 로컬 주소 http://localhost:8081/