Babel - 에러 해결, 기본 패키지 정리

Node.js 환경에서 ES6이상의 최신 javascript를 실행시키다보면 종종 에러가 발생합니다.

 

저도 이번에 프로젝트를 하면서 express를 import 했더니 요론 에러가 발생했습니다.

 

 

ERROR : Cannot use import statement outside a module

 

이 에러는 Node.js 환경에서 import 문구를 사용할 수 없다는 것인데요.

 

보통 babel과 webpack을 사용해서 해결합니다.

 

일단 바벨부터!!

 

 

Babel??

 

: 짧게 요약하자면 ECMAScript 2015+ 코드를 이전 버전과 호환되도록 변환해주는 toolchain 입니다.

: JavaScript Compiler ( 본인들이 지칭하는 용어)

 

 

사용 가이드에 보면 아래와 같이 설치를 하라고 나옵니다.

npm install --save-dev @babel/core @babel/cli @babel/preset-env

+ 저는 오류를 해결하기 위해서 @babel/node까지 설치 했습니다.

 

각각의 패키지가 무슨 용도인지 정리해보려고 합니다.

 

 

@babel/preset-env

• 대상 환경에 필요한 syntax transform을 세부적으로 관리할 필요없이 JavaScript를 사용할 수 있는 스마트 사전설정
• target을 별도로 지정할 수 있지만 지정하지 않을 경우 모든 ES2015-ES2020 코드를 ES5와 호환되도록 변환 함
• .browserslistrc 파일을 이용해서 대상을 지정할 수 있음 하지만 대상을 지정하지 않을 경우 default query를 사용할 수 없음

 

@babel/cli

• command liine에서 파일을 컴파일하는데 사용할 수 있는 CLI
• 프로젝트별로 로컬에 설치하는 것을 추천함
• npx 명령어와 상호작용 하여 사용함
• npx 외에도 npm run script 내부에 추가하거나 상대경로를 사용하여서도 실행할 수 있음
• 무시할 파일을 선택하거나 복사할 파일을 지정할 수 있음 모든 ES2015-ES2020 코드를 ES5와 호환되도록 변환 함
• .browserslistrc 파일을 이용해서 대상을 지정할 수 있음 하지만 대상을 지정하지 않을 경우 default query를 사용할 수 없음

 

 

 

babel 공식사이트

babeljs.io/docs/en/

Babel · The compiler for next generation JavaScript