Vue / cli

1. NPM

: Node Package Manager

: Command에서 써드파티 모듈을 설치하고 관리하는 툴

 

 

2. NPM 명령어

① npm init : 새로운 프로젝트나 패키지를 만들 때 사용(package.json이 생성)

② npm install package : 생성되는 위치에서만 사용가능한 패키지로 설치

③ npm install -g pakage : 글로벌 패키지에 추가 / 모든 프로젝트에서 사용 가능한 패키지로 설치

 

 

3. @vue/cli

- CLI : Command Line Interface

: Vue.js 개발을 위한 시스템으로 Vue.js에서 공식적으로 제공하는 CLI

: 개발의 필수는 아니지만 개발의 편리성을 위해 필수처럼 사용

: Vue 프로젝트를 빠르게 구성할 수 있는 스캐폴딩 제공

: Vue와 관련된 오픈소스들의 대부분이 CLI를 통해 구성 가능하도록 구현되어 있음

 

 

4. SFC

: Single File Component

: 확장자가 ".vue"인 파일

: .vue = template + script + style

: 구문 강조 가능

: 컴포넌트에만 CSS 적용 범위 제한 가능

: 전처리기 사용으로 기능 확장 가능

 

① <template>

: 기본언어 → html

: 각 파일은 최대 하나의 템플릿 블록 포함 가능

: 내용은 문자열로 추출되어 컴파일 된 Vue Component의 템플릿 옵션으로 사용

 

② <script>

: 기본언어 → js

: 각 *.vue 파일은 한번에 최대 하나의 스크립트 블록 포함 가능

: ES2015(ES6)를 지원하여 import와 export 사용가능

 

③ <style>

: 각 파일은 여러개의 스타일 블록 지원

: scoped 속성을 이용해 현재 컴포넌트에서만 사용가능한 css 지정 가능