Vue.js 기초 익히기 (3) === ###### tags: `지호`, `Vue.js 기초 익히기` --- ## 1. 여러 개의 Vue 인스턴스 사용하기 ![스크린샷 2022-04-11 오전 10 25 16](https://user-images.githubusercontent.com/24283401/162650173-ddfc4af0-6354-4330-8044-c644fb80a741.png) - this -> 자신의 뷰 인스턴스를 가리킴 - app1 -> 다른 뷰 인스턴스를 가리킴 ## 2. Vue 컴포넌트 ![image](https://user-images.githubusercontent.com/24283401/162642513-00296d62-111d-43db-9226-e03c0159cbef.png) - 전역 객체를 등록할 때는 data를 함수로 받아야한다. - 전역 등록하면 최종 빌드에 들어가있어서, 파일 용량이 커지고 사용자가 내려받는 자바스크립트 양이 커짐 ![](https://i.imgur.com/L4Dak8c.png) ## 3. Vue Cli로 뷰 설치하기 1. Node.js 설치 2. vue-cli 설치 ```shell= # 방법 1 sudo npm install -g @vue/cli vue --version vue create [projectName] # router, vuex 옵션 추가 # 방법 2: vue/cli를 전역적으로 설치하지 않는다. npx @vue/cli create [projectName] # 실행 npm run serve ```