새로운 형태의 Web Task Manager

• 기존 Web Task Manager(Gulp, Grunt)의 기능 + 모듈 의존성 관리 (ex. manification을 webpack defailt cli로 실행 가능)

  webpack -p

자바스크립트 Code based modules 관리

• 자바스크립트 모듈화의 필요성: AMD, Common js, ES6(Modules)
• 기존 모듈 로더들과의 차이점: 모듈간의 관계를 chunk 단위로 나눠 필요할 때 로딩
• 현대의 웹에서 js의 역할이 커짐에 따라 client side에 들어가는 코드량이 많아지고 복잡해짐
• 복잡한 웹 앱을 관리하기 위해 모듈 단위로 관리하는 Common js, AMD, ES6 Modules 등이 등장
• 가독성이나 다수 모듈 미병행 처리등의 약점을 보완하기 위해 Webpack이 등장

자바스크립트 모듈화 문제란?

• 모듈화 하지 않으면 같은 스코프에서 실행되기 때문에 스크립트 로딩순서, 전역변수 충돌, 복잡도에 따른 관리상의 문제가 발생.
• 이를 해결하기 위해 AMD및 기타 모듈 로더들. Webpack이 등장했다.

• 모든 웹 자원(js, css, html)이 모듈 형태로 로딩 가능

  require("base.css")
  require("main.js")

• 초기에 불필요한 것들을 모두 로딩하지 않고 필요할 떄 필요한 것만 로딩하여 사용