"moduleResolution"은 뭘까 ?

[yunseorim1116]

// tsconfig.node.json

"module": "ESNext",
"moduleResolution": "bundler",

• 기본설정

module

| 소스 코드가 컴파일될 때 어떤 모듈 시스템을 사용할지 결정하는 역할을 합니다.
module 옵션은 우리가 내보낼 output, 컴파일 후에 생성되는 JavaScript 파일이 어떤 모듈 시스템을 사용할지 결정하는 것입니다.

예를 들어 TypeScript 코드를 컴파일하면 JavaScript 파일이 생성되는데 이 파일이 CommonJS, ES Modules, 또는 AMD와 같은 모듈 시스템 중 어떤 것을 사용할지를 결정하는 것이 module 옵션입니다.

module: "CommonJS": Node.js에서 사용하는 CommonJS 모듈 시스템으로 컴파일됩니다.
module: "ESNext": 최신 ECMAScript 모듈 시스템(ESM)으로 컴파일됩니다.

이 옵션은 컴파일된 결과물에만 영향을 미칩니다.

moduleResolution

| 현재 소스코드 내부에 import 되어 있는 모듈들의 경로(specifier)를 어떻게 해석할지 결정하는 옵션

"bundler"(번들러 사용 시)*: package.json 의 exports, imports 필드 설정값을 기반으로 모듈 경로를 해석합니다.

2024년 10월 기준으로 사용할 수 있는 moduleResolution 옵션 세 가지를 소개합니다.

1. nodeNext

최신 Node.js 정책에 기반하여 모듈 경로를 해석합니다.
이 옵션을 사용할 때는 module 옵션도 반드시 nodeNext로 설정해야 합니다.
최신 Node.js 환경에서 권장되며, 모듈을 다룰 때 최신 Node.js 모듈 정책을 준수합니다.

2. node16

Node.js v16+ 정책을 따릅니다.
module 옵션은 반드시 node16으로 설정해야 하며, nodeNext로 설정하면 안 됩니다.
nodeNext와 거의 동일하지만, Node.js v16에 맞춰진 설정입니다.

3. bundler

번들러와 유사한 방식으로 모듈 경로를 해석합니다. nodeNext와 비슷하지만, 다음과 같은 차이점이 있습니다.
1.상대 경로로 모듈을 import할 때 파일 확장자 생략이 가능합니다.
2. 디렉토리 모듈 (예: index.js 파일)을 사용할 수 있습니다.

최신 Node.js에서는 import 시 파일 확장자를 반드시 명시해야 하며 디렉토리 모듈은 허용되지 않습니다. 그러나 일부 번들러는 확장자 생략을 지원하므로, 이에 대응하여 TypeScript v5부터 bundler 옵션이 추가되었습니다.

이 옵션을 사용할 경우 module 옵션은 반드시 esnext로 설정해야 합니다.

어플, 라이브러리 개발

어플리케이션 개발 - node.js 환경

module: nodenext
moduleResolution: nodeNext

라이브러리 개발 - 번들러 없음

module: node16

• 구체적인 node 버전을 고정하는 것이 더 안전합니다. 코드가 Node.js 의 모듈 시스템과 잘 호환된다면 대부분의 번들러에서도 잘 컴파일될 것입니다.

moduleResolution: node16

• module: node16 인 경우 반드시 moduleResolution 도 node16 여야 합니다.

라이브러리 컴파일과 어플리케이션 컴파일의 차이

• 어플리케이션은 실행될 런타임, 또는 번들러만 고려합니다. (어떻게 실행되는지 예상 가능한 환경)
• 라이브러리는 사용자의 컴파일 과정에 포함됩니다. (=빌드과정에서 해석)

출처