웹팩(webpack) 이란

웹팩

JS 모듈을 비롯한 관련 리소스들에 대한 모듈 번들러

• 필요성

  웹 개발은 매우 작은 리소스들과 약간의 JS 가 포함된 웹 페이지에서 복잡한 JS 와 대규모 트리를 가지고 다양한 기능을 갖춘 웹 앱으로 발전

  복잡성에 대응하기 위해 JS 모듈, JS 전처리기, JS로 컴파일 되는 언어(TypeScript) 같은 방법들이 고안되지만 브라우저가 이해하려면 번들로 묶고 변환(트랜스미션, 컴파일) 등의 추가 단계 필요해짐

• WebPack

  프로젝트 구조를 분석하고 JS 모듈을 비롯한 관련 리소스들을 찾은 후 이를 브라우저에서 이용할 수 있는 번들로 묶고 패킹하는 모듈 번들러

• 그런트나 걸프와 같은 빌드 도구와의 차이점

  Webpack은 태스크 러너나 빌드 시스템과 다르지만 대체하며 장점 제공할 수 있음

  • 그런트나 걸프 같은 빌드 툴

    정의한 경로에서 구성과 일치하는 파일 찾고 구성 파일에서 이러한 파일을 변환, 조합 및 축소하는 작업이나 단계 지정해야 함
    

  • 웹팩

    프로젝트 전체를 한 단위로 분석
    
    지정한 메인 파일에서 시작해 require, import 문을 참고해 프로젝트의 모든 의존성 조사하고 로더를 이용해 처리 한 후 번들로 묶은 JS 파일을 생성
    
    빌드 툴 들 보다 더 빠르고 직관적
    
    JS 이외 다른 파일 형식까지 번들로 묶을 수 있는 방법 제공
    

출처 : https://jusungpark.tistory.com/52