
[Vite] 단일 파일 컴포넌트(SFC) 사용하기
Framework/Vite
2023. 8. 7. 11:40
단일 파일 컴포넌트(SFC)는 Vue.js에서 컴포넌트를 정의하는 편리한 형식으로, HTML 템플릿, JavaScript 코드, 그리고 CSS 스타일을 한 파일에 작성할 수 있습니다. 이를 통해 컴포넌트를 더욱 모듈화하고 관리하기 쉽게 만들어줍니다. 이 글에서는 단일 파일 컴포넌트의 구조와 사용 방법을 알아보겠습니다. 단일 파일 컴포넌트 구조 단일 파일 컴포넌트는 .vue 확장자를 가진 파일로 구성됩니다. 이 파일에는 세 가지 블록으로 구분되어 있습니다. 템플릿(Template) 블록 템플릿 블록은 컴포넌트의 렌더링 로직을 담당합니다. Vue.js의 템플릿 문법을 사용하여 화면에 표시할 내용을 정의합니다. 스크립트(Script) 블록 스크립트 블록은 컴포넌트의 동작 로직과 데이터를 정의합니다. Vue 인..