Vue 애플리케이션 만들기

node --version

위 명령으로 노드 버전을 확인합니다. Node.js 버전이 16 미만이라면 16 이상 버전으로 업데이트 해주셔야 Vue.js 3.x.x 버전을 사용하실 수 있습니다.

npm init vue@latest

위 명령을 통해 create-vue를 설치 및 실행합니다.

그러면 아래처럼 몇 가지 선택 사항에 대해 선택할 수 있습니다. 우선 저는 모두 No로 했습니다.

여러분의 사정에 맞게 체크해주세요.ㅣ

cd 프로젝트이름
npm install
npm run dev

방금 생성한 프로젝트 폴더로 이동 후

패키지들을 설치합니다.

그리고 실행하면 Vue 프로젝트가 실행하게 됩니다.

인터넷 브라우저에서 localhost:5173에 접속하면 아래와 같은 웹 페이지가 보일 것입니다.

Ctrl + C 를 눌러 호스팅을 종료할 수 있습니다.

{
  "name": "vue-study",
  "version": "0.0.0",
  "private": true,
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "vue": "^3.3.11"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.5.2",
    "vite": "^5.0.10"
  }
}

package.json에서 vue 버전이 3.x.x 인 것을 확인해주세요.