유형이 지정되지 않은 npm 모듈 용 TypeScript 사용자 정의 선언 파일

Question

TypeScript를 사용하는 프로젝트에 npm에서 shiitake이라는 리 액트 구성 요소를 사용하고 있습니다. 그 라이브러리에는 TypeScript 선언이 없으므로이 라이브러리에는 하나를 쓸 것이라고 생각했습니다.

import * as React from 'react'; 

declare module 'shiitake' { 

    export interface ShiitakeProps { 
     lines: number; 
    } 

    export default class Shiitake extends React.Component<ShiitakeProps, any> { 
    } 
} 

난 아래의 오류를보고하고 ./typings/shiitake.d.ts 파일 내부 및 VS 코드에 넣어 가지고 : 선언 파일은 (는 완전하지 않을 수 있지만 그것에 대해 너무 많이 걱정하지 마십시오) 다음과 같은

/// <reference path="../../../../typings/shiitake.d.ts" /> 
import * as React from 'react'; 
import Shiitake from 'shiitake'; 

: 소비 측면에서

[ts] Invalid module name in augmentation. Module 'shiitake' resolves to an untyped module at 'd:/dev/foo/foobar.foo.Client.Web/node_modules/shiitake/dist/index.js', which cannot be augmented.

, 나는 여전히 같은 오류도 위의 선언하면 (내가 가진 이후 noImplicitAny 컴파일러 스위치가 켜져) 무엇입니까

이 모듈 유형의 ​​선언 파일을 얻는 표준은 @types/ way이며, 잘 작동합니다. 그러나 사용자 지정 입력 작업을 수행 할 수 없습니다. 이견있는 사람?

Answer 1

선언 declare module 'shiitake';은 전체 범위에 있어야합니다. 즉 비 모듈 (모듈이 적어도 하나의 최상위 레벨이 import 또는 export 인 파일 인 경우)의 최상위 레벨 선언.

모듈에있는 declare module '...' { } 형식의 선언은 기능 보강입니다 (자세한 내용은 https://github.com/Microsoft/TypeScript-Handbook/blob/fa9e2be1024014fe923d44b1b69d315e8347e444/pages/Declaration%20Merging.md#module-augmentation 참조). 오늘 같은 문제가 있었다

declare module 'shiitake' { 

    import * as React from 'react'; 

    export interface ShiitakeProps { 
     lines: number; 
    } 

    export default class Shiitake extends React.Component<ShiitakeProps, any> { 
    } 
} 

Answer 2

:

그래서 당신처럼이 파일이보고 싶어요.

내 보낸 인터페이스를 모듈 선언 외부에 붙여 넣습니다. 템플릿으로 사용한 입력 파일에는 파일 끝에 개인 인터페이스가 있습니다.

따라서 내 보낸 인터페이스가 모듈 선언 외부에서 선언되었습니다. 이것은 타이프 스크립트 컴파일러의 견과입니다.

인터페이스를 모듈 경계로 옮기면 모든 문제가 해결됩니다.

Answer 3

내 경험에 의하면, 정의 파일은 수출이 이거나 모듈 정의 외부에서을 가져 오는 경우 이런 방식으로 실패합니다. 자동 가져 오기 기능이있는 IDE를 사용한다면 경고하십시오!