Babel 노드 (Node.js) ✘

Node.js 환경에서의 ES 모듈 사용

@babel/node

@babel/node는 Node.js 명령어 환경(CLI)과 동일하게 작동합니다. 다만 명령을 실행하기 전에 Babel 사전 설정(presets) 및 플러그인(plugins)을 사용해 컴파일 한 후, 코드를 실행한다는 점이 다릅니다.

Node.js 12 버전부터 ES 모듈을 (실험적으로) 지원 함에 따라 @babel/node 사용은 필요하지 않습니다.

Node.js ES 모듈

Node.js에서 ES 모듈을 사용하려면 파일 확장자를 js 대신 mjs를 사용하거나, package.json 파일에 "type"을 모듈(module)로 설정해 사용해야 합니다.

mjs 확장자

프로젝트에서 부분적으로 ES 모듈을 사용할 때 가장 쉽고 빠르게 적용할 수 있는 방법입니다.

src/
├── ellipseText.mjs
└── index.mjs

src/index.mjs

import { ellipseText } from './ellipseText.mjs'

console.log(
  ellipseText(
    `Node.js 환경에서 ES 모듈을 사용하려면 mjs 확장자 또는 
     package.json에 type을 module로 설정해야 합니다.`
  )
)

src/ellipseText.mjs

export const ellipseText = (text, limit = 100) => `${text.slice(0, limit)}...`

모듈을 불러올 때 반드시 확장자 추가 필요

import 키워드로 모듈을 불러올 때 반드시 확장자까지 포함해서 경로를 명시를 해줘야 합니다. 이는 ES 표준 방식을 맞추기 위해 의도적으로 설계된 부분이기 때문입니다. (웹 브라우저도 동일하게 동작)

module 타입 설정

package.json 파일 설정을 통해 전체 파일에 적용하는 방법으로 모든 파일의 확장자를 일일이 mjs로 바꾸지 않고, 프로젝트 전체에 ES 모듈을 적용하고 싶을 때 적합한 방법입니다.

package.json

{
  "type": "module"
}

package.json 타입 설정을 모듈로 변경하면 다시 js 확장자를 사용해 ES 모듈을 사용합니다.

src/index.js

import { ellipseText } from './ellipseText.js'

console.log(
  ellipseText(
    `Node.js 환경에서 ES 모듈을 사용하려면 mjs 확장자 또는 
     package.json에 type을 module로 설정해야 합니다.`
  )
)

src/ellipseText.js

export const ellipseText = (text, limit = 100) => `${text.slice(0, limit)}...`

실행 성공: 출력 메시지

(node:33561) ExperimentalWarning: The ESM module loader is experimental.

Node.js 환경에서 ES 모듈을 사용하려면 mjs 확장자 또는 package.json에 type을 module로 설정...

실행 실패: 출력 메시지

(node:32823) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.

SyntaxError: Cannot use import statement outside a module

참고

@babel/node · Babel