ZeroCho Blog

ESM vs CommonJS 시리즈로 계속 블로깅을 하고 있습니다.

이번 게시글에서는 ESM 모듈에서 CommonJS 모듈 파일을 import하는 방법에 대해 알아보겠습니다. 다음 게시글은 반대로 CommonJS에서 ESM 모듈을 require하는 방법에 대해 알아봅니다. 준비할 파일은 3가지입니다.

package.json

...
  "type": "module",
...

esm.js

import a, { c } from './cjs.cjs'; // 확장자 명시 필요
console.log(a); // { a: 'b', c: 'd' }
console.log(c); // d

cjs.cjs

exports.a = 'b';
exports.c = 'd';

package.json에는 현재 프로젝트가 ESM임을 알리고, cjs.cjs에 CommonJS 스타일로 모듈을 export 한 뒤 esm.js에서는 ESM 스타일로 모듈을 import합니다.

node esm으로 파일을 실행해보면 문제 없이 실행됩니다. 즉, ESM에서 CommonJS 파일을 불러올 때는 큰 문제가 없습니다. 반대로 CommonJS에서 ESM을 불러올 때는 문제가 발생합니다. 다음 게시글을 보시죠.