Vue 3.0 - 프로젝트 생성

Vue CLI 설치

• Vue CLI: Vue 프로젝트를 빠르게 구성하고 빌드, 디플로이 할 수 있게 도와주는 도구

  - npm install -g @vue/cli

프로젝트 생성

아래의 명령으로 프로젝트 실행

vue create vue-hello

cd vue-hello

npm run serve

http://localhost:8080/ 으로 접속

Default 옵션으로 프로젝트 설치하기

• Vue 프로젝트 생성

  • vue create 프로젝트명

• Vue 프로젝트 실행

  • npm run serve

  • npm run serve -- --port 다른포트번호

• Vue 프로젝트 파일 구조

  • node_modules

  • public: 웹팩을 통해 관리되지 않는 정적 리소스가 모여있는 디렉토리

  • src/assets

  • src/components

  • App.vue: 최상위(root) 컴포넌트

  • main.js: 가장 먼저 실행되는 JS 파일로써, Vue 인스턴스 생성 역할

  • .gitignore

  • babel.config.js

  • package-lock.json: 설치된 package의 dependency 정보 관리하는 파일

  • package.json

  • README.md

  VS Code Default Formatter 설정

  File -> Preference -> Settings 들어가 아래와 같이 설정

  

  Format on Save 체크