빌드 / 최적화

번들러(Bundler)

번들러(Bundler)는 import/export 관계를 분석해 여러 파일을 배포 가능한 코드 묶음으로 만들어주는 빌드 도구입니다.

쉬운 설명

import로 연결된 파일들을 분석해 배포 가능한 번들로 묶어주는 도구.

배경과 쓰임까지 이해하기

조금 더 자세히

번들러(Bundler)는 import/export 관계를 분석해 여러 파일을 배포 가능한 코드 묶음으로 만들어주는 빌드 도구입니다.

개발 서버 실행, 프로덕션 빌드, 코드 분할, CSS 처리, 이미지 경로 변환 같은 작업에서 등장합니다.

번들러(Bundler)는 빌드 도구의 한 종류이고, Vite는 개발 서버와 번들링 경험을 함께 제공하는 구체적인 도구입니다.

실제로는 이렇게 만나요

번들러(Bundler)은(는) 실제 작업 흐름에서 Bundling, Vite, Module 같은 개념과 함께 등장합니다.

  • 이런 거 할 때 나와요 개발 서버 실행, 프로덕션 빌드, 코드 분할, CSS 처리, 이미지 경로 변환 같은 작업에서 등장합니다.
  • 이렇게 생겼어요 번들러(Bundler)은(는) Bundling, Vite, Module 같은 주변 개념과 함께 문서, 설정 화면, 오류 메시지에서 자주 보입니다.
  • 나오는 화면 예시 빌드 / 최적화 작업을 하다가 Bundling, Vite, Module를 확인하는 화면

헷갈리기 쉬운 점

번들러(Bundler)는 빌드 도구의 한 종류이고, Vite는 개발 서버와 번들링 경험을 함께 제공하는 구체적인 도구입니다.

왜 알아두면 좋을까요?

개발 서버 실행, 프로덕션 빌드, 코드 분할, CSS 처리, 이미지 경로 변환 같은 작업에서 등장합니다.

Checklist

실제로 볼 때 확인할 것

  1. 01

    정의보다 쓰이는 상황을 먼저 본다

  2. 02

    관련 개념을 함께 확인한다

  3. 03

    실제 프로젝트에서 등장한 위치를 기록한다

관계 지도