tsconfig.json 에 moduleResolution "bundler",node 차이점?(트러블슈팅)

moduleResolution: bundler

moduleResolution은 TypeScript 컴파일러가 모듈을 어떻게 해석하고 찾을지를 결정하는 설정입니다.

 

 moduleResolution: node

 

"node"로 설정하면 Node.js의 모듈 해석 방식을 사용하게 됩니다.

 

Node.js 스타일 모듈 해석:

• Node.js가 모듈을 찾는 방식을 모방합니다.
• node_modules 디렉토리를 검색하고, package.json 파일을 참조합니다.

1. 상대 경로와 절대 경로 지원:
   • 상대 경로 (예: './module')와 절대 경로 (예: '/root/module') 모두 지원합니다.
2. 파일 확장자 처리:
   • .ts, .tsx, .d.ts 파일을 자동으로 인식합니다.
   • JavaScript 파일(.js)도 함께 사용할 수 있습니다.
3. 타입 정의 파일 해석:
   • @types 패키지에서 타입 정의를 자동으로 찾습니다.
4. package.json의 'types' 또는 'typings' 필드 지원:
   • 패키지의 타입 정의 파일 위치를 명시적으로 지정할 수 있습니다.

이 설정이 문제를 해결한 이유:

• Swiper와 같은 외부 라이브러리의 모듈과 타입 정의를 더 정확하게 찾을 수 있게 되었습니다.

대안으로 "moduleResolution": "bundler"도 있지만, "node"가 더 널리 사용되고 대부분의 프로젝트에 적합합니다.

이 설정으로 TypeScript가 모듈을 더 정확하게 해석할 수 있게 되어, 이전에 발생하던 타입 오류가 해결된 것으로 보입니다.