Node 에서 import export 사용하기 위한 babel 과 type: module 의 차이

babel

---

JavaScript 코드 컴파일러

 

babel 사용 목적

---

1. 브라우저 호환성
2. 새로운 기능 사용
3. 코드 품질 향상
4. 플러그인과 확장 가능성

 

JavaScript코드는 계속해서 발전하며 웹 브라우저의 경우도 발전이 되지만

 

웹브라우저에서 최신버전의 JavaScript코드와 호환 되지 않을 경우가 발생한다.

 

최신버전으로 작성된 JavaScript코드를 구버전(ES5)의 JavaScript코드로 변환하여 웹브라우저와 호환이 되도록 해준다.

 

Type: module 설정 이유

---

Node.js에서 CommonJs 모듈 시스템을 ES 모듈 시스템으로 사용

 

장단점

---

"type: module" 사용하기

 

- 장점

• 네이티브 ECMScript 모듈 시스템을 사용하여 런타임 성능 개선
• Node.js 환경에서 모듈 로딩 시 번들링 , 변환 과정 생략
• 프로젝트 설정 간편화

 

- 단점

• 브라우저 호환성 문제 ( 모든 브라우저에서 "Type: module" 지원하지 않을 수 있음 )
• 브라우저 환경에 따른 번들러 필요 유무

 

babel 사용하기

 

- 장점

• 브라우저 호환성 보장 , 최신 JS 문법과 기능 사용 가능
• 브라우저에서 변환 된 코드를 통해 ES6 모듈 문법 사용 가능
• 다양한 플러기은 사용으로 코드 변환과 최적화 조정 가능

 

- 단점

• 변환 작업이 필요하므로 빌드 단계에서 추가적인 처리 필요
• 일부 경우 번들 크기 증가
• 번들링 및 변환 과정에 따른 빌드 시간 증가