홈>2020-03-18 13:14

일단 변환 된 TypeScript의 선언 된 (내 보낸 것이 아닌) 모듈의 열거 형에 액세스

TL;DR

네임 스페이스를 내 보내지 않고 선언하는 것만으로 네임 스페이스 내의 열거 형에 액세스하고 싶습니다. 변환 된 네임 스페이스는 정의되지 않은 객체이므로 네임 스페이스에 액세스 할 수 없으므로 네임 스페이스에 오류가 발생하여 열거 형에 액세스 할 수 없습니다.

설명

TypesScript에서 프로젝트를 설정하고 있는데이 프로젝트와 관련된 모든 정의를 가져 오는 것을 피하고 싶습니다. 이 스 니펫에서는 redux 논리에 대한 로컬 정의를 넣을 네임 스페이스를 만들었습니다.

리덕스 선언의 추출 (redux.d.ts) :

declare namespace Redux {
    namespace Actions {
        enum TypeKeys {
            REDUX_INIT          = '@@redux/INIT',
            BOOTSTRAP           = 'BOOTSTRAP',
            CORPUS_LOADED       = 'CORPUS_LOADED',
            ...
        }
        ...
        interface Definition {
            doSomething(): void;
            ...
        }
        ...
    }
    namespace Store {
        interface Definition { ... }
        ...
    }

}

내 코드의 정의를 가져 오는 것을 피할 수 있습니다 (예 : const mapStateToProps = (state: Redux.Store.Definition) => state; 최상위 구성 요소에서는Redux네임 스페이스를 가져올 필요가 없습니다)

문제를 해결하기 위해이 감속기를 썼습니다 (corpusReducer.ts추출) :

// Note: no need to import Redux!
export default (state: Redux.Store.CorpusManagement, action: Redux.Actions.ActionTypes): Redux.Store.CorpusManagement => {
    switch (action.type) {
        case Redux.Actions.TypeKeys.CORPUS_LOADED:
            return { corpus: action.payload };
        default:
            return state === undefined ? { corpus: { documents: [] } } : state;
    }
};

번역 된 후 case Redux.Actions.TypeKeys.CORPUS_LOADED 줄에 대해ReferenceError : Redux가 정의되지 않았습니다오류가 발생합니다. .

내 용의자는 Redux 네임 스페이스이므로 TypeScript 세계에 속하기 때문에 런타임에 사용할 수 없습니다. TypeKeys 반면에, 그것은 JavaScript로 매핑되어야하는 열거 형이므로, 예상되는 행동은 열거 형이 일단 변환 된 후에도 여전히 액세스 가능하다는 것입니다.

내보내기를 추가하면 ( declare namespace Redux 로 줄 바꾸기) ) 파일이 모듈로 '승격 됨'이지만 코드의 어느 곳에서나 가져와야합니다.

질문

내보내기 절을 피하면서 어떻게 열거 형에 액세스 할 수 있습니까 (따라서 어디서나 모듈을 명시 적으로 가져 오려면)? 내가 따르지 않는 좋은 습관이 있습니까?

typescript

답변 # 1

Enum은 열거 형 객체를 사용하여 런타임에 값을 보유합니다. 즉,이 개체에 액세스 할 수없는 경우 개체의 존재 여부에 따른 코드가 검색에 실패합니다.

가장 좋은 해결책은 객체를 내보내는 것입니다. 열거 형을 보유하는 추가 모듈을 추가하고 가져옵니다.

이것이 가능하지 않다면 선언에 const enum을 사용할 수 있습니다. Const 열거 형은 컴파일러가 열거 형 값에 대한 참조를 발견 할 때마다 실제 값이 생성 된 JS에 하드 코딩되므로 오브젝트의 존재에 의존하지 않습니다.

const enum TypeKeys { // No code for const enums is generated.
    REDUX_INIT = '@@redux/INIT',
    BOOTSTRAP = 'BOOTSTRAP',
    CORPUS_LOADED = 'CORPUS_LOADED',
}

let d = TypeKeys.BOOTSTRAP; // All enum references are replaced with values, so this becomes var d = "BOOTSTRAP"

이 접근 방식은 모든 값이 JS에 하드 코딩되어 있고 열거 형을 변경하면 열거 형을 참조하는 코드를 다시 작성해야 함을 의미하므로주의해야합니다.

수정

나에게 맞는 전체 코드 :

// definitions.d.ts
declare namespace Redux {
    namespace Actions {
        const enum TypeKeys {
            REDUX_INIT          = '@@redux/INIT',
            BOOTSTRAP           = 'BOOTSTRAP',
            CORPUS_LOADED       = 'CORPUS_LOADED',
        }
        interface Definition {
            doSomething(): void;
        }
        interface ActionTypes {
            type: TypeKeys
            payload: any;
        }
    }
    namespace Store {
        class CorpusManagement {}
    }
}
// usage.ts
/// <reference path="./definitions.d.ts" />
export default (state: Redux.Store.CorpusManagement, action: Redux.Actions.ActionTypes): Redux.Store.CorpusManagement => {
    switch (action.type) {
        case Redux.Actions.TypeKeys.CORPUS_LOADED:
            return { corpus: action.payload };
        default:
            return state === undefined ? { corpus: { documents: [] } } : state;
    }
};

출력 :

(...)
(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    /// <reference path="./definitions.d.ts" />
    exports.default = (state, action) => {
        switch (action.type) {
            case "CORPUS_LOADED" /* CORPUS_LOADED */:
                return { corpus: action.payload };
            default:
                return state === undefined ? { corpus: { documents: [] } } : state;
        }
    };
});

Python2.net

일단 변환 된 TypeScript의 선언 된 (내 보낸 것이 아닌) 모듈의 열거 형에 액세스

관련 자료