그알것 — 그럼에도 알아야 할 것들
홈질문커뮤니티
로그인
그알것 — 그럼에도 알아야 할 것들

Service

  • 홈
  • 소개
  • 질문
  • 커뮤니티

My

  • 내 워크스페이스
  • 저장한 질문
  • 작성한 답변

Policy

  • 이용약관
  • 개인정보처리방침
  • 문의

© 2026 그알것 · What Still Matters

질문 목록JavaScript
JavaScript

CommonJS와 ES Module의 차이점에 대해서 설명해주세요

실무4/5
설계4/5
인간3/5
기초3/5

면접관의 질문 의도

문법 차이만 외운 사람인지, 정적/동적 로딩 모델·트리 쉐이킹·환경 호환까지 보고 _상황에 맞게 선택_할 수 있는 사람인지를 가른다.

큐레이션 답변

학습 자료

CommonJS는 Node에서 출발한 모듈 시스템으로 require/module.exports를 쓰며 동기적·런타임 로드, 동적 require 가능, _값 복사_라는 특성을 갖는다. ES Module(ESM)은 표준 모듈 시스템으로 import/export 문법을 쓰고 _정적 구조_라 빌드 시점에 의존 그래프와 사용된 export를 분석할 수 있어 트리 쉐이킹에 유리하다. ESM은 라이브 바인딩이라 import한 값이 원본 변경을 반영한다. 그래서 CJS는 동적 환경에 유연하지만 번들 최적화에 약하고, ESM은 정적 분석·표준 호환에 강한 대신 Node와 브라우저 환경별 설정이 필요하다.

좋은 답변 구조

  1. 01CJS·ESM이 "모듈 분리"라는 같은 목적을 가진다는 공통점부터 짚는다
  2. 02정적 vs 동적 로딩, 값 복사 vs 라이브 바인딩, 트리 쉐이킹 가능 여부를 차이 축으로 설명한다
  3. 03Node 패키지·브라우저·번들러 환경별 선택 기준과 dual-publish 트레이드오프를 제시한다
  4. 04package.json type/exports 설정 같은 실무 적용 예시로 마무리한다

자주 실수하는 포인트

두 시스템 차이를 "문법만 다르다"로 뭉뚱그린다
선택 기준 없이 ESM이 "무조건 좋다"고 단정한다
CJS에서 require로 받는 값과 ESM의 라이브 바인딩 차이를 모른다
type:module/.mjs 설정이 런타임 동작에 미치는 영향을 빠뜨린다

실무 맥락

  • Node 라이브러리를 CJS·ESM dual-publish로 배포해야 하는 작업
  • 번들러에서 트리 쉐이킹이 안 되는 패키지 때문에 번들이 커지는 디버깅
  • Next/Vite 같은 환경에서 CJS 전용 의존성과 ESM 코드가 섞여 런타임 에러가 나는 상황

본인 경험에 녹이는 힌트

CJS 전용 패키지를 ESM 프로젝트에 끌어와 "named export가 안 들어온다"를 만난 적이 있다면 두 시스템 모델 차이로 자연스럽게 풀 수 있다

라이브러리를 dual-publish하면서 package.json exports를 설정한 적이 있다면 환경별 호환 기준이 답변 후크가 된다

트리 쉐이킹이 되도록 ESM 빌드만 분리해본 적이 있다면 정적 분석 이야기로 이어진다

커뮤니티 인기 답변

전체 0개

아직 공개된 답변이 없어요. 첫 공개 답변을 남겨보세요.

관련 꼬리 질문

Q1Node.js에서 ESM을 사용할 때 package 설정은 어떻게 관리하나요
Q2트리 쉐이킹은 왜 ESM에서 더 유리한가요
Q3CJS와 ESM을 혼용할 때 주의할 점은 무엇인가요
아직 답을 쓰지 않았어요.
큐레이션 답변과 다른 사람 답변을 보고, 자기 언어로 답을 정리해보면 학습 효과가 가장 큽니다.
목차
  • 01면접관의 질문 의도
  • 02큐레이션 답변
  • 03좋은 답변 구조
  • 04자주 실수하는 포인트
  • 05실무 맥락
  • 06본인 경험에 녹이는 힌트
  • 07커뮤니티 인기 답변준비중
  • 08관련 꼬리 질문