정의 파일에서 주변 열거형을 올바르게 사용하는 방법

정의 파일에서 enum를 선언해야 하는 경우 이상한 동작이 발생하여 다음과 같은 결과가 발생할 수 있습니다.

/// module A
/// types.d.ts
export enum MyEnumA {
     A = "A"
}


/// module B
/// main.ts
import { MyEnumA } from 'A'
console.log(MyEnumA.A) 
// TypeError: cannot read property 'A' of undefined

왜요?

간단히 말해서 정의 파일은 값으로 참조할 수 없으므로 'Ambient'라고 합니다.

제대로 해결하는 방법은?

const enum 솔루션(권장하지 않음)

프로젝트에 매우 간단한 설정이 있는 경우. TypeScript 기능 호출const enum을 사용할 수 있습니다.

const as a prefix of enum will turn this enum into an inline constant in compiler time.

/// module A
/// types.d.ts
export const enum MyEnumA {
     A = "A"
}


/// module B
/// main.ts
import { MyEnumA } from 'A'
console.log(MyEnumA.A) 

/// module B compiled
/// main.js
console.log("A") // <<< here is the hardcoded value from enum

하지만 이 방법이 권장되지 않는 이유는 무엇입니까?

이 접근 방식은 isolatedModule 옵션

을 지원하지 않습니다.

은 MyEnumA.A로 하드코딩된 값으로 변환됩니다. module B enum 값이 변경되면 다시 컴파일module A하여 하드코딩된 값

을 업데이트해야 합니다.

Typescript 팀에서 권장하지 않음https://www.typescriptlang.org/docs/handbook/enums.html#const-enum-pitfalls

전역 범위에서 주변 값 선언(권장)

적절한 솔루션은 이 열거형 값을 주변에 할당하는 것입니다. Ambient는 추상화일 뿐이므로 Ambient에서도 선언할 때 구현 파일에서 이 값을 할당해야 합니다.

따라서 정의 파일에서 enum를 주변으로 선언하고 전역 범위 변수에 값을 할당합니다.

/// module A
/// types.d.ts
declare enum MyEnumAValue { // ambient enum
     A = "A"
}
declare var MyEnumA: typeof MyEnumAValue // ambient value

/// module B
/// types.ts as ambient value file
enum MyEnumAValue {
    A = 'A'
}

window.MyEnumA = MyEnumAValue; /// this will be checking with ambient if enum value is consistent with ambient enum
// or
global.MyEnumA = MyEnumAValue;


/// main.ts
import 'A'
console.log(MyEnumA.A) 

유형 검사 작업 방법은 다음과 같습니다.

일관된

일관성 없는

요약

유형 정의 파일을 사용하고 그 안에 enum을 선언하려는 경우.

구현 파일에서 환경에서도 선언한 대로 값을 할당해야 합니다.

가장 좋은 방법은 열거형 값을 전역 범위 변수에 할당하는 것입니다.