sodol-dotcom

TypeScript 모듈의 글로벌 스코프 인식으로 인한 파일 충돌 방지 방법 본문

Frameworks & Libraries/TypeScript

TypeScript 모듈의 글로벌 스코프 인식으로 인한 파일 충돌 방지 방법

sod0l 2024. 9. 24. 16:52

TypeScript는 기본적으로 파일을 글로벌 스코프(전역 공간)로 인식한다. 그래서 변수나 함수가 다른 파일에서 중복으로 사용될 경우 충돌할 수 있다. 해결 방안으로 아래 두가지 방법이 있다.

 

 

1. 각 파일에 `export {};`추가하기

  • 이 방법은 각 TypeScript 파일의 맨 아래에 `export {};`라는 코드를 추가하는 것이다.
  • 이 코드를 넣으면 TypeScript가 해당 파일을 모듈로 인식한다.
  • 하지만 모든 파일에 이 작업을 일일이 추가해야 하므로, 관리가 번거롭다.

 

 

2. `tsconfig.json`에서 `"moduleDetection": "force"` 설정하기

  • `tsconfig.json` 파일은 TypeScript의 설정을 관리하는 곳이다. 여기서 `"moduleDetection": "force"` 를 설정하면 TypeScript가 모든 파일을 모듈로 인식하게 된다. 즉 모든 파일이 독립적인 공간에서 작업할 수 있게 된다.
  • 이 방법은 프로젝트 전체에 적용되기 때문에, 각각의 파일에 별도로 작업을 추가할 필요가 없어 매우 편리하다.

 

 

이렇게 `export {};`를 추가하거나 `"moduleDetection": "force"`를 설정하면 TypeScript가 각 파일을 모듈로 인식하여, 서로 영향을 주지 않게 되어 코드의 충돌을 방지할 수 있다.