What is WebPack

• 최신 프론트엔드 프레임워크에서 가장 많이 사용 되고 있는 모듈 번들러

Javscript 번들러 종류

• webpack
• parcel
• browserify

웹팩에서의 구성

• ES modules - import 구문
• Common JS modules — require() 구문
• AMD modules — define 과 require 구문
• CSS imports — css/sass/less 파일 안에서 사용되는 @import 구문
• Image URLs — url(…) 또는 <img src=”…/”>

<aside> ℹ️ 웹팩은 다른 종류의 모듈들을 자바스크립트 코드로 합쳐서 import 하도록 한다.

</aside>

웹팩 설정하기

root 폴더에 webpack.config.js

What is Module?

• 프로그래밍 관점의 모듈
• 웹팩에서의 모듈
• JS 모듈 등장 배경

What is Module Bundler?