Vue.js 3 프로젝트 생성

my_mon·2023년 2월 8일
0
post-thumbnail

Vue.js 가 초면인 상황에서 공부를 시작하였다.
프로젝트를 새로 생성 및 설정하면서 느꼈던 것은 역시 난 코드를 작성하는 것 보다 환경설정이 훨씬 어렵다는 것!

이번에 프로젝트를 생성 한 방법도 정석은 아니다.
앞으로 여러 Vue.js 3 프로젝트를 생성하면서 숙련된다면 추후에 수정할 예정이다.

우선 내가 프로젝트를 생성한 방법을 작성해보자...

  1. 프로젝트를 생성할 디렉토리 만들기
  2. 개발할 프레임워크 상단메뉴 File-Open 클릭하여 생성한 디렉토리 불러오기
    (내가 쓰는 프레임워크는 인텔리제이!)
  3. 로컬 터미널에서 node.js 버전 확인
    node -v
    확인되지 않다면 아래 링크로 접속하여 설치해주자.
    https://nodejs.org/ko/download/
  • node.js는 npm을 사용하기 위해 필요하다.
  • npm은 노드 패키지 매니저의 약자로 패키지를 관리하는 곳이다.
  1. vue/cli 설치
    npm install -g @vue/cli

위의 네 과정으로 vue 프로젝트를 생성하기 위한 준비는 끝났다.
이제 본격적으로 vue 프로젝트를 생성 해보자!

vue create 프로젝트명
그 후 사용하는 버전을 설정해 주면 vue 프로젝트 생성이 완료된다.

cd 프로젝트명 를 입력하여 생성된 프로젝트로 경로 이동을 한 후
npm run serve 명령어를 입력하여 프로젝트를 실행해 준다.

마지막으로 프로젝트가 무사히 실행된 것을 확인하려면 터미널창에 실행 성공 후 띄워진 localhost 주소로 접속하여 확인하면 된다.

이렇게 개발환경 세팅은 의외로 간단하다.

 
profile
기록하는 사람

0개의 댓글