[JavaScript] Webpack 이란? 그리고 gulp와의 비교

Webpack은 자바스크립드 모듈 번들러

https://webpack.js.org/

1.모듈 : 코드의 재사용이나 유지보수를 위해 여러개로 분리한 자바스크립트 파일

a.js
b.js
c.js

개발 편의성을 위해 모듈을 계속 분리하게 되면 페이지 로딩시간이 길어짐.
이를 보완하기 위해서는 브라우저에서 서버로 요청하는 http 갯수를 줄여야 하는데..

a.js
b.js ===> bundle.js
c.js

2. 여러 모듈을 하나의 파일로 묶어서 배포 하는 것을 "번들링" 이라고 하며, 번들링을 위한 도구를 "번들러" 라고 한다.

번들러 종류는 WebPack, Broserify, Parcel등 이 있는데, Webpack이 가장 인기 있다.

Gulp는 자주 반복되는 작업을 자동화 하는 도구

https://gulpjs.com/

- 복잡한 번들링과 종속성 관리가 개발 프로세스에 중요하다면 Webpack

- 일반적인 개발 작업을 자동화하는 간단하고 명확한 방법이 필요하다면 Gulp

- 상황에 맞게 선택해서 사용하면 된다 ✅