WEB · BUNDLE

Webpack 번들링 파이프라인

Webpack은 entry에서 시작해 import 의존성을 그래프로 만들고 loader와 plugin을 거쳐 브라우저용 bundle을 출력합니다.

Webpack 번들링 파이프라인 구조

webpack
entry애플리케이션 시작 파일
graphimport 의존성 수집
loader/plugin파일 변환과 빌드 확장
outputbundle 파일 생성
entry→graph→loader/plugin→output

Webpack 번들링 파이프라인 기준

점검
LoaderCSS, 이미지, TS 같은 파일을 모듈로 변환합니다.
PluginHTML 생성, 환경 변수, 최적화 등 빌드 전반을 확장합니다.
Modedevelopment와 production 최적화가 다릅니다.
Split코드 분할로 초기 bundle을 줄일 수 있습니다.