[Vue와 Webpack] webpack은 무엇이고 왜 사용해야 하는가?

webpack이란

웹팩은 모듈 번들러이다. 공식 홈페이지에서는  '서로 연관이 있는 모듈 간의 관계를 해석하여 정적인 자원으로 변환해 주는 변환 도구'라고 설명한다. 이를 좀 더 쉽게 설명하면, '파일 간의 연관 관계를 파악하여 하나의 자바스크립트 파일로 변환해 주는 변환 도구'이다.

 

다시 말해, 애플리케이션 동작과 관련된 여러 개의 파일(HTML, CSS, JS, 이미지 등)을 1개의 자바스크립트 파일 안에 다 넣어 버리고, 해당 자바스크립트 파일을 로딩해 이를 모두 구현할 수 있게 만드는 도구인 것이다.

 

장점

HTTP 네트워크 요청이 적어지기 때문에, 웹 화면 로딩 시간을 단축할 수 있다.

 

특징

대세 프레임워크 3가지 (Angular, React, Vue)에서 모두 권하는 모듈 번들러이다.