남과 같이 해선 남 이상이 될 수 없다.

카테고리 없음

[Bundler] 번들러

맨동 2021. 8. 12. 19:50
728x90

1. 번들러의 개념

웹사이트에서는 HTML, CSS, JavaScript가 동작을 합니다.

React, SCSS, TypeScript 등의 여러 라이브러리나 프레임워크를 사용하여 코딩을 진행하고 프로젝트를 제작합니다. 그리고 번들러를 통해 변환하는 과정을 거쳐 HTMl, CSS, JavaScript로 웹에서 동작시킬 수 있도록 합니다.

물론, 번들러가 직접적으로 변환시키는 것은 아닙니다. 예를 들어, SCSS 문법을 CSS로 변환시킬 때 parcel-bundler가 Sass라는 외부 패키지를 설치하여 이로부터 도움을 받아 완료한 것입니다.

3. parcel VS webpack

3.1 parcel

parcel 번들러는 별도의 구성이 없는 단순 자동 번들링을 제공해줍니다. 매우 편리한 번들러이지만 webpack 번들러에 비해 구성이 꼼꼼하지 않습니다. 그러므로 프로젝트의 규모가 커질수록 parcel 번들러의 아쉬움을 발견하는 경우가 있습니다. 이러한 이유로 parcel 번들러는 소/중형 프로젝트에 적합하다고 할 수 있습니다.

3.2 webpack

webpack 번들러는 꼼꼼하고 자세하게 번들링할 수 있는 구성 옵션을 설정해줄 수 있습니다. 그러한 구성 옵션을 통해 개발자의 입맛에 맞게 정리를 할 수 있습니다. 그러므로 당연하게도 중/대형 프로젝트에 유용하게 사용 가능합니다. 그러나 아무래도 이러한 이유로 확인해야할 사항이 많다는 단점이 있습니다.

728x90