웹팩(Webpack)이란?

웹팩이란

여러 개의 파일을 하나의 파일로 합쳐주는 모듈 번들러

번들링이란

어떤 것을 묶는다는 사전적 의미를 가지고 있고, 프로그래밍에서는 모듈화했던 js파일을 묶어준다는 뜻

-대표적으로 프론트엔드 개발에 가장 많이 사용되고 있는 것이 웹팩(Webpack)임.
빌드 = 번들링 = 변환 같은 말이라고 생각하면 된다.

웹팩이 필요한 이유

1. 웹 에플리케이션의 빠른 로딩 속도와 높은 성능을 위해

로딩 속도 개선을 위한 대표적인 것이 브라우저 -> 서버로 요청하는 파일의 숫자를 줄이는 것.

• 웹팩은 기본적으로 필요한 자원을 미리 로딩하는 것이 아니라 그때 그때 요청한다.

2. 자바스크립트 모듈화로 인한 이슈 해결

• 일반적인 방식으로 자바스크립트를 모듈화해서 각각 불러오면 자바스크립트의 특성에 따라 변수가 같은 스코프를 공유하게 되어 전역변수끼리 충돌이 발생할 수 있다. 자바스크립트 라이브러리 로딩 순서에 따른 이슈도 발생할 수 있고, 복잡도에 따른 관리 문제 또한 생길 수 있음.
• 웹팩을 사용하면 수많은 모듈 중, 당장 의존성이 있는 클래스나 함수를 적시에 가져와서 사용할 수 있게 할 뿐더러, 외부 라이브러리의 의존성을 쉽게 관리 할 수 있다.