webentwicklung-frage-antwort-db.com.de

Benutzerdefinierte TypeScript-Deklarationsdateien für nicht typisierte npm-Module

Ich verbrauche eine React-Komponente namens shiitake from npm in mein Projekt, in dem ich TypeScript verwende. Diese Bibliothek hat keine TypeScript-Deklarationen, also dachte ich, ich würde eine schreiben. Die Deklarationsdatei sieht wie folgt aus (sie ist möglicherweise nicht vollständig, macht sich jedoch nicht zu viele Sorgen):

import * as React from 'react';

declare module 'shiitake' {

    export interface ShiitakeProps {
        lines: number;
    }

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

Ich habe dies in ./typings/shiitake.d.ts-Datei und VS-Code eingefügt. Ich sehe die folgende Fehlermeldung:

[ts] Ungültiger Modulname in der Erweiterung. Das Modul 'shiitake' wird in ein nicht typisiertes Modul unter 'd: /dev/foo/foobar.foo.Client.Web/node_modules/shiitake/dist/index.js' aufgelöst, das nicht erweitert werden kann.

Auf der Verbraucherseite bekomme ich immer noch den gleichen Fehler, auch wenn mit der obigen Deklaration (da ich noImplicitAny Compiler-Schalter eingeschaltet habe):

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

[ts] Konnte keine Deklarationsdatei für das Modul 'shiitake' finden. 'd: /dev/foo/foobar.foo.Client.Web/node_modules/shiitake/dist/index.js' hat implizit den Typ 'any'.

Der Standard, warum Deklarationsdateien für diese Art von Modulen erworben werden, ist durch @types/ way und funktioniert gut. Ich kann jedoch nicht die benutzerdefinierte Arbeitsweise erhalten. Irgendwelche Gedanken?

22
tugberk

Die Deklaration declare module 'shiitake'; sollte in einem globalen Bereich liegen. eine Deklaration der obersten Ebene in einem Nichtmodul (wobei ein Modul eine Datei mit mindestens einer import oder export der obersten Ebene ist).

Eine Deklaration des Formulars declare module '...' { } in einem Modul ist eine Erweiterung. Weitere Informationen finden Sie unter TypeScript Module Augmentation .

Sie möchten also, dass diese Datei so aussieht:

declare module 'shiitake' {

    import * as React from 'react';

    export interface ShiitakeProps {
        lines: number;
    }

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

Nach meiner Erfahrung schlägt eine Definitionsdatei auf diese Weise fehl, wenn Exporte oder importe außerhalb der Moduldefinition deklariert wurden. Wenn Sie einen IDE mit automatischem Import verwenden, seien Sie gewarnt!

0
Ed Staub

Ich hatte heute das gleiche Problem.

Es stellte sich heraus, dass ich exportierte Schnittstellen außerhalb der Moduldeklaration eingefügt habe .. Die Typisierungsdatei, die ich als Vorlage verwendete, hatte private Schnittstellen am Ende der Datei.

Daher wurden meine exportierten Schnittstellen außerhalb der Moduldeklaration deklariert. Dies ist die TypScript-Compilermuttern der Laufwerke.

Nachdem ich die Schnittstellen in die Modulgrenzen verschoben hatte, wurde alles behoben.

0