Community

[아티클 요약] CommonJS와 ESM에 모두 대응하는 라이브러리 개발

해당 아티클은 CommonJS와 ESM 방식의 차이를 간단히 설명하고 package.json 을 통해 두 방식을 지원하는 방법을 설명하는데요, 직접 만든 라이브러리를 배포하고 싶은데 다양한 Node 버전에도 대응하고 싶을 때 참고하면 좋을 것 같습니다. [요약] - CommonJS와 ESM 은 Module System 으로 Node.js 12버전 이전까지는 CommonJS 방식을, 그 이후부터는 ESM 방식이 새로 추가됨 - CommonJS는 require/module.exports를 사용 - CommonJS module loader는 동기적으로 작동 - CommonJS module 은 동적 제약이 없기 때문에 런타임에서만 모듈관계를 파악할 수 있어 Tree-shaking이 어려움 - ".cjs" 확장자를 사용하거나 package.json에 type 필드를 명시하지 않으면 CommonJS방식으로 해석됨 - ESM은 import/exports를 사용 - ESM은 Top-level Await을 지원하기 때문에 비동기적으로 작동 - ESM은 정적인 구조로 강제하여 빌드단계에 모듈관계를 파악할 수 있어 Tree-shaking이 용이함 - ".mjs" 확장자를 사용하거나 package.json에 type 필드로 "module" 로 명시해야 ESM으로 해석됨 - package.json의 exports 필드를 사용해 CommonJS와 ESM 방식으로 각각 빌드한 결과물을 라이브러리를 사용하는 Node 환경에 맞춰줌 - 구체적으로 exports 필드는 subpath exports(filesystem 상의 위치와 import path를 다르게 지정함)와 conditional exports(같은 import path에 대해 특정 조건에 따라 다른 모듈 제공)기능을 제공함

알림

알림이 없습니다