Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | |
7 | 8 | 9 | 10 | 11 | 12 | 13 |
14 | 15 | 16 | 17 | 18 | 19 | 20 |
21 | 22 | 23 | 24 | 25 | 26 | 27 |
28 | 29 | 30 |
Tags
- 풀스택 개발
- dom
- aondroid toolchain 오류
- Node.js
- cmdline-tools missing
- #프론트엔드개발
- 패키지 스크립트
- 컴포넌트
- React
- 프론트엔드
- Promise
- macos flutter
- JavaScript
- 웹 개발
- flutter 오류
- 웹 성능
- 프라미스체이닝
- 코드리뷰
- 비동기프로그래밍
- flutter android sdk
- 퍼포먼스 최적화
- jsx
- 자바스크립트공부
- 웹개발
- css
- fe
- 웹 성능 최적화
- 자바스크립트
- html
- 국제화(i18n)
Archives
- Today
- Total
sodol-dotcom
TypeScript 모듈의 글로벌 스코프 인식으로 인한 파일 충돌 방지 방법 본문
Frameworks & Libraries/TypeScript
TypeScript 모듈의 글로벌 스코프 인식으로 인한 파일 충돌 방지 방법
sod0l 2024. 9. 24. 16:52TypeScript는 기본적으로 파일을 글로벌 스코프(전역 공간)로 인식한다. 그래서 변수나 함수가 다른 파일에서 중복으로 사용될 경우 충돌할 수 있다. 해결 방안으로 아래 두가지 방법이 있다.
1. 각 파일에 export {};
추가하기
- 이 방법은 각 TypeScript 파일의 맨 아래에
export {};
라는 코드를 추가하는 것이다. - 이 코드를 넣으면 TypeScript가 해당 파일을 모듈로 인식한다.
- 하지만 모든 파일에 이 작업을 일일이 추가해야 하므로, 관리가 번거롭다.
2. tsconfig.json
에서 "moduleDetection": "force"
설정하기
tsconfig.json
파일은 TypeScript의 설정을 관리하는 곳이다. 여기서"moduleDetection": "force"
를 설정하면 TypeScript가 모든 파일을 모듈로 인식하게 된다. 즉 모든 파일이 독립적인 공간에서 작업할 수 있게 된다.- 이 방법은 프로젝트 전체에 적용되기 때문에, 각각의 파일에 별도로 작업을 추가할 필요가 없어 매우 편리하다.
이렇게 export {};
를 추가하거나 "moduleDetection": "force"
를 설정하면 TypeScript가 각 파일을 모듈로 인식하여, 서로 영향을 주지 않게 되어 코드의 충돌을 방지할 수 있다.
'Frameworks & Libraries > TypeScript' 카테고리의 다른 글
TypeScript 시작하기: 환경 설정부터 Hello World 실행까지 (1) | 2024.09.24 |
---|