Webpack 파이프라인은 entry에서 브라우저 실행 파일까지 이어진다
각 파일은 loader로 변환되고 plugin이 산출물을 조정한 뒤 output 경로에 chunk와 asset으로 배치된다.
| 단계 | 하는 일 | 확인 값 | 실패 신호 |
|---|---|---|---|
| Resolve | import 경로와 확장자 찾기 | alias, extensions | 모듈을 찾지 못함 |
| Load | 파일 형식별 변환 | Babel, CSS, asset loader | 문법 또는 파일 타입 오류 |
| Optimize | 분할, 압축, tree shaking | mode, splitChunks | 번들이 지나치게 큼 |
| Emit | dist에 파일 출력 | filename, hash, publicPath | 배포 경로와 파일명 불일치 |
| Runtime | 브라우저가 chunk를 로드 | HTML script, dynamic import | chunk loading failed |
번들링 문제는 entry만 보지 말고 resolve, loader, optimize, emit, runtime 중 어디에서 끊겼는지 나눈다.