Typisierung für npm reagieren Modul für Typoskript

Question

Ich versuche, die Typisierung für ein reaktives Modul, react-input-autosize, für die Verwendung in einem Typoskript-Projekt zu definieren. Das Modul hat keine Readymades.

Ich habe ein Verzeichnis react-input-autosize zu typings/modules hinzugefügt. Dann habe ich dem neuen Verzeichnis eine Datei index.d.ts hinzugefügt. füllte ich die neue Datei mit meinem Verständnis der Struktur des eingeführten Moduls (die vom Typoskript Compiler akzeptiert wird):

/// <reference path="../../globals/react/index.d.ts" /> 
/// <reference path="../../globals/react-dom/index.d.ts" /> 

declare module 'react-input-autosize' { 
    import * as React from "react" 
    import * as ReactDOM from "react-dom" 

    export interface AutosizeInputProps extends React.Props<any>{ 
     className?: string,  
     defaultValue?: any,  
     inputClassName?: string, 
     inputStyle?: any, 
     minWidth?: number, 
     onKeyDown?: (x:any) => void, 
     onChange?: (x:any) => void, 
     placeholder?: string, 
     placeholderIsMinWidth?: boolean, 
     style?: any, 
     value?: string, 
     readOnly?: boolean, 
     autoFocus?: boolean, 
     type?: string 
    } 

    export class AutosizeInput extends React.Component<AutosizeInputProps, any> { 
     constructor(props? : AutosizeInputProps, context? : any); 

     greeting: string; 
     showGreeting(): void; 
    } 

    export default AutosizeInput; 
} 

An dieser Stelle das Modul in dem Projekt zu importieren begann im Sinne Erfolg, dass ich erhalten keine „Modul nicht gefunden“ Fehler mehr, indem Sie:

import AutosizeInput from 'react-input-autosize'; 

Instanziierungsanwendung die AutosizeInput Klasse leider jetzt zur Laufzeit nicht funktioniert, wie AutosizeInput Ergebnisse nicht definiert werden.

In einer Nicht-Typoskript-Datei innerhalb desselben Projekts funktioniert import AutosizeInput from 'react-input-autosize'; immer noch, daher wird das Modul korrekt aus npm importiert, wenn es nicht typisiert ist.

Answer 1

Sie default Import:

import AutosizeInput from 'react-input-autosize'; 

wird versuchen, die default Export zu importieren. Aber das Modul react-input-autosize hat keinen Standard-Export. Können Sie versuchen, mit:

import * as AutosizeInput from 'react-input-autosize'; 

Und die Beseitigung default von Ihrem Export:

export = AutosizeInput; 

Hoffe, es hilft.