데이터 분석 기술 블로그

Vue에 관하여(14)_SFC build tool(Vite) 본문

프론트엔드

Vue에 관하여(14)_SFC build tool(Vite)

데이터분석가 이채은 2024. 7. 25. 09:00

1. Vite

프런트엔드 개발 도구로 빠른 개발 환경을 위한 빌드 도구와 개발 서버를 제공합니다.


1-1. Vite 튜토리얼


2. NPM

Node Package Manager(NPM)란, Node.js의 기본 패키지 관리자입니다. Chrome의 V8JavaScript 엔진을 기반으로 하는 Server-Side 실행 환경입니다.


2-1. Node.js의 영향


3. Vite 프로젝트 구조

3-1. node_modules


3-2. package-lock.json


3-3. package.json


3-4. public 디렉토리


3-5. src 디렉터리


3-6. src/assets


3-7. src/components


3-8. src/App.vue


3-9. src/main.js


3-10. index.html


4. 모듈과 번들러

Module은 프로그램을 구성하는 독립적인 코드 블록(*. js 파일)입니다.


4-1. node_modules의 의존성 깊이


Bundler란, 여러 모듈과 파일을 하나 (혹은 여러 개)의 번들로 묶어 최적화하여 애플리케이션에서 사용할 수 있게 만들어 주는 도구입니다.