[JS/TS] 패키지 매니저와 모듈 번들러

패키지 매니저 (Package Manager)

 

• 주요 기능
  • 프로젝트의 의존성(dependency)
  • 관리패키지 설치, 업데이트, 삭제
  • 버전 관리

• 예시:
  • npm
  • yarn
  • pnpm

 

• 주요 역할:
  • package.json 파일을 통한 프로젝트 의존성 관리
  • 패키지 저장소에서 필요한 라이브러리 다운로드
  • 의존성 충돌 해결

 

모듈 번들러 (Module Bundler)

• 주요 기능:
  • 여러 개의 파일/모듈을 하나의 파일로 병합
  • 코드 최적화 및 압축
  • 개발 환경 구성

• 예시:
  • Webpack
  • Rollup
  • Vite
  • Parcel

• 주요 역할:
  • 모듈 의존성 분석
  • 코드 변환 (TypeScript → JavaScript, SCSS → CSS 등)
  • 코드 최적화 (압축, 트리 쉐이킹 등)
  • 개발 서버 제공

 

핵심 차이점

• 목적:
  • 패키지 매니저: 외부 라이브러리 관리
  • 모듈 번들러: 소스 코드 최적화 및 배포 준비
• 작업 범위:
  • 패키지 매니저: 프로젝트 의존성 관리에 중점
  • 모듈 번들러: 실제 코드 처리 및 최적화에 중점
• 사용 시점:
  • 패키지 매니저: 개발 환경 구성 시
  • 모듈 번들러: 개발 및 배포 과정에서

 

 

 

패키지 관리자는 패키지를 관리하는 도구 

모듈 번들러는 파일이나 모듈등의 병합에 쓰이는 도구