Babel 이란?

 

 

프로젝트 할 때 babel.config.js 파일을 보면서 이게 뭐지 싶어 검색해본 적이 있다.

그런데 이게 문법도 아니고 언어도 아니라 그런지 계속 그 의미를 잊게 되는 마성의 babel ....

 

그래서 오랜만에 자바스크립트 공부를 다시 하던 중에 babel 키워드를 발견해서 정리해보려고한다.

 

 

babel 이란 무엇인가 ···

자바스크립트의 변수 타입에는 var / let / const 가 있다.

var 사용을 지양한다고는 하나, let / const 변수의 경우 IE9, IE10 에서 사용이 불가하다.

그러면 IE9, IE10 환경에서는 var 타입의 변수만 선언할 수 있는 걸까?

  결론은 아니다!

왜냐하면 babel 이 존재하기 때문 ···

 

구형 브라우저에서도 코드가 돌아갈 수 있게끔 도와주는 도구가 바로 babel 인 것이다.

하지만 babel 을 사용한다고 해서 최신 언어 및 문법을 구형 브라우저에서 바로 사용할 수 있는 것은 아니다.

babel 은 최신 문법을 자바스크립트로 변환만 할 뿐,

babel-polyfill 을 통해 브라우저에서 지원하지 않는 최신 문법에 대한 플러그인을 추가하여 호환성을 채워넣는 작업이 필요하다.

 

 

■ babel : 컴파일 (소스코드 -> 기계어 -> 응용프로그램 변환) 시 실행

■ babel-polyfill : 런타임 (응용프로그램 동작) 시 실행