Webpack, Babel 개념

0. 모듈 번들러: webpack, parcel...

  (1) 여러개의 자바스크립트 파일을 하나의 파일로 묶어서 한 번에 요청하여 가져올 수 있게 하는 라이브러리

  (2) 최신(모던) 자바스크립트 문법을 브라우저에서 사용할 수 있도록 해줌

 

1. 개요

 1) html에 설정된 자바스크립트 파일을 가져오기 위해 서버와 통신하는 절차가 잦아져 비효율적일 수 있음

 2) 자바스크립트는 모듈 개념이 부재, 변수 스코프를 고려하여 개발  -> 모던 자바스크립트는 모듈 개념 존재

 3) 수많은 자바스크립트 파일이 묶인다면 초기 로딩 속도에 문제가 있을 수 있음 -> 캐시, 코드 스플릿으로 해결

 4) 기존의 그런트나 걸프처럼 정의한 경로에서 일치하는 파일을 찾지만, webpack은 프로젝트를 한 단위로 분석

 5) 지정한 메인 파일에서 require나 import문을 통해 프로젝트 내 모든 의존성을 검사, 처리

 

 ※ Babel: 자바스크립트 컴파일러

  (1) 계속해서 발전하는 자바스크립트의 모든 문법을 브라우저가 해석할 수는 없음

  (2) 모던 자바스크립트 문법을 기존의 자바스크립트 문법 형식으로 변환하여 브라우저가 인식, 작동할 수 있게 함