모듈 번들러, Webpack

WebPack을 알기전에

모듈 번듈러란?

모듈 번들러란 여러개의 나누어져 있는 파일들을 하나의 파일로 만들어주는 라이브러리를 말한다.

이 모듈 번들러 라이브러리중에 웹팩이 속해있다.

 

모듈 번들러의탄생 배경

옛날 자바스크립트는 모듈 개념이 없었기 때문에 파일이 나누어져 있어도

변수범위를 생각하면서 개발을 해야했었다.

이런 문제를 해결하기위해 모듈 이라는 개념이 생겼지만 지원을 안하는 브라우저들도

있기때문에 브라우저들이 지원 할 수 있는 코드로 변환해 줘야했다.

그 무언가가 웹팩(Webpack)과 같은 모듈 번들러 라이브러리이다.

 

모듈 번들러의 장점

자바스크립트 코드들을 압축하고 최적화 할 수 있기 때문에 로딩속도를 높일 수 있다.

하지만 수 많은 자바스크리브 파일이 하나의 파일로 묶인다면 초기 로딩 속도가 느려질 수 있지만 모듈 번들러들은 이런 문제를 해결하기 위해 청크,캐스,코드 스플릿 개념들을 도입하면서 문제들을 해결하고있다.

 

참고 블로그

https://velog.io/@jeff0720/React-개발-환경을-구축하면서-배우는-Webpack-기초

React 개발 환경을 구축하면서 배우는 웹팩(Webpack) 기초