Webpack 빌드 파이프라인

입구에서 의존성을 모아 브라우저가 읽을 결과물로 만든다은 Entry, Loader, Plugin를 실제 브라우저 흐름에서 나눠 확인해야 구현 기준과 실패 대응이 흐려지지 않습니다.

01

Entry

애플리케이션 시작 파일을 기준으로 그래프를 만듭니다.

02

Loader

JS가 아닌 CSS, 이미지, JSX 같은 파일을 변환합니다.

03

Plugin

HTML 생성, 환경 변수, 최적화 같은 빌드 작업을 확장합니다.

04

Output

번들 파일명과 배포 위치를 결정합니다.

핵심학습 판단 설정이 복잡해질수록 entry, loader, plugin, output 네 축으로 나눠 보면 어디를 고쳐야 하는지 빠르게 찾을 수 있습니다.