SFC (Single File Components) 는 무엇인가?
Single File Components , SFC - .vue 확장자를 가진 싱글 파일 컴포넌트
페이지내 Vue 선언 방식의 disadvantages(약점)
● Global definitions - 모든 컴포넌트에 대한 고유한 이름 필요
● String templates - 구문 강조가 약함, 여러 줄로 된 HTML에 보기 안좋은 슬래시
● No CSS support - CSS is conspicuously left out
CSS 를 지원하지 않는 것이 아니라 CSS 가 눈에 띄게 모듈화 되지 않음
● No build step – 전처리기가 아닌 HTML 및 ES5 JavaScript로 제한
페이지내 Vue 선언 방식 약점을 해결한 SFC 의 특징
● Complete syntax highlighting - Atom, Sublime Text, Visual Studio Code, Intellij
● CommonJS modules – ES2015(ES6), CommonJS(ServerJS)
● Component-scoped CSS – Scoped CSS
실제 SFC 로 개발된 Example
Simple To Do App - https://codesandbox.io/s/o29j95wx9
- index.html
- index.js
- App.vue
- variables.scss
- TodoList.vue
- TodoListItem.vue
- BaseInputText.vue
NPM
ES6
반응형
'Frontend > vue' 카테고리의 다른 글
[Hoon] Vuejs 강의 - 조건문과 반복문 (0) | 2020.04.13 |
---|---|
[Hoon] Vuejs 강의 - Vue 시작하기(Getting Started) (0) | 2020.04.13 |
[Hoon] Vuejs 강의 - SPA (Single-Page Application)는 무엇인가? (0) | 2020.02.17 |
[Hoon] Vuejs 강의 - PWA (Progressive Web Application) 는 무엇인가? (0) | 2020.02.17 |
[Hoon] Vuejs 강의 - Vue.js가 무엇인가? (0) | 2020.02.17 |
댓글