Webpack은 @sokra(Tobias Koppers)와 컨트리뷰터들이 구현하고 있는 자바스크립트 기반의 모듈 번들러와 그를 받쳐주는 라이브러리(webpack/lib), 그리고 에코시스템(플러그인, 로더)들을 의미합니다.
스포카에서는 2014년 12월부터 React.js를 전면 도입하여 새 버젼의 적립 애플리케이션을 제작하고 있습니다. 이 개발 과정을 뒷받침해주고 있는 가장 중요한 도구를 말하라고 한다면 두말할 것도 없이 Webpack일 것입니다.
사실 Node.js나 파이썬 같은 환경에서 개발을 해본 사람들에게는 모듈이라는 개념이 익숙하지만, 웹 프론트엔드 개발자에게 모듈이라는 개념은 조금 낯설 수 있는 것이 사실입니다. require.js와 같은 AMD 시스템 또는 Browserify같은 도구를 이용해 본 경험이 없다면 말이죠.
모듈이라는 것은 굉장히 중요합니다. 모듈 시스템을 갖춘 환경에서 일해본 사람은 어떤 이유에서든 그 중요성에 모두 공감할 것입니다. 하지만 웹에는 표준적인 개념의 모듈이라는 것이 없었습니다 (사실 아직도 제대로 된 것은 딱히 없습니다만). 그렇기 때문에 자바스크립트 모듈을 사용하기 위해서는 모듈을 다룰 수 있는 시스템 (RequireJS, CommonJS 등)이 필요하고, 모듈들의 내용과 export들을 이해하고 원하는 형태로 변형할 수 있는 도구가 필요합니다. Webpack과 Browserify는 이런 것을