(Vue) 뷰 실행하기/Vue 처음 실행 (상세한 설명)

웹/(Vue)뷰

공부가싫다가도좋아 2023. 7. 12. 20:10

포스팅 목차

1. code 편집기에서 원하는 파일 열기

포스팅 목차에서 원하는 파트를 누르면 해당 파트로 자동 스크롤 됩니다. 참고해주세요 !!

코드 편집기에서 개발환경을 세팅할 폴더를 열어줍니다.

저는 visual studio code를 사용해서,

posting1 이라는 폴더 안에 vue를 실행할 환경을 세팅해보려고 합니다.

$ npm install -g @vue/cli

위 명령어를 썼을때 위와 같이 오류가 날 경우에는 아래 명령어로 설치해주세요.

** 아래 명령어 입력시 Password입력을 해야되는데 컴퓨터 비밀번호를 치면 됩니다.

$ sudo npm install -g @vue/cli

명령어 실행후 아래 사진과 같이 나오면 설치 완료!!!

$ vue create .

vue create . 을 하면 현재 폴더안에 vue프로젝트를 생성한다

** 현재 폴더 말고 새롭게 생성된 폴더안에 vue프로젝트를 실행하고 싶을때는 아래 명령어 실행

$ vue create myPjt

위 명령어를 입력할 경우 myPjt라는 폴더 안에 vue프로젝트가 생성된다.

vue create . 명령어를 실행했을 경우 아래와 같이 현재 디렉토리에 프로젝트를 생성할것인지 물어본다.

그러면, y 입력후 엔터

저는 그냥 Vue 3를 고르겠습니다.

원하시는 버전 선택 후 엔터누르시면 됩니다.

$ npm run serve

ctrl 누른후 저 http://localhost:8081 주소 클릭 혹은 주소창에 직접 입력하기.