Wie erstellt man eine .d.ts-„Typisierungs“-Definitionsdatei aus einer vorhandenen JavaScript-Bibliothek?

StackOverflow https://stackoverflow.com//questions/12687779

  •  12-12-2019
  •  | 
  •  

Frage

Ich verwende viele Bibliotheken sowohl von mir selbst als auch von Drittanbietern.Ich sehe, dass das Verzeichnis „typings“ einige für Jquery und WinRT enthält ...aber wie entstehen sie?

War es hilfreich?

Lösung

Je nachdem, um welche Bibliothek es sich handelt, wie sie geschrieben ist und welches Maß an Genauigkeit Sie suchen, stehen Ihnen einige Optionen zur Verfügung.Sehen wir uns die Optionen in ungefähr absteigender Reihenfolge ihrer Wünschbarkeit an.

Vielleicht existiert es bereits

Überprüfen Sie immer DefinitelyTyped (https://github.com/DefinitelyTyped/DefinitelyTyped) Erste.Dies ist ein Community-Repo voller buchstäblich Tausender .d.ts-Dateien und es ist sehr wahrscheinlich, dass das, was Sie verwenden, bereits dort ist.Sie sollten auch TypeSearch überprüfen (https://microsoft.github.io/TypeSearch/), eine Suchmaschine für von NPM veröffentlichte .d.ts-Dateien;Dies wird etwas mehr Definitionen haben als DefinitelyTyped.Einige Module liefern auch ihre eigenen Definitionen als Teil ihrer NPM-Distribution aus. Überprüfen Sie daher auch, ob dies der Fall ist, bevor Sie versuchen, Ihre eigenen zu schreiben.

Vielleicht brauchen Sie keinen

TypeScript unterstützt jetzt das --allowJs Flag und wird mehr JS-basierte Rückschlüsse in .js-Dateien ziehen.Sie können versuchen, die .js-Datei zusammen mit der Datei in Ihre Zusammenstellung aufzunehmen --allowJs Einstellung, um zu sehen, ob Sie dadurch ausreichend gute Typinformationen erhalten.TypeScript erkennt Dinge wie Klassen im ES5-Stil und JSDoc-Kommentare in diesen Dateien, kann jedoch Probleme verursachen, wenn sich die Bibliothek auf seltsame Weise initialisiert.

Beginnen Sie mit --allowJs

Wenn --allowJs Sie haben gute Ergebnisse erzielt und Sie möchten selbst eine Datei mit besserer Definition schreiben, die Sie kombinieren können --allowJs mit --declaration um TypeScripts „beste Schätzung“ zu den Typen der Bibliothek anzuzeigen.Dies gibt Ihnen einen guten Ausgangspunkt und kann genauso gut sein wie eine handverfasste Datei, wenn die JSDoc-Kommentare gut geschrieben sind und der Compiler sie finden konnte.

Erste Schritte mit dts-gen

Wenn --allowJs hat nicht funktioniert, vielleicht möchten Sie dts-gen (https://github.com/Microsoft/dts-gen), um einen Ausgangspunkt zu erhalten.Dieses Tool verwendet die Laufzeitform des Objekts, um alle verfügbaren Eigenschaften genau aufzuzählen.Positiv zu vermerken ist, dass dies tendenziell sehr genau ist, aber das Tool unterstützt noch nicht das Scraping der JSDoc-Kommentare, um zusätzliche Typen zu füllen.Sie führen dies folgendermaßen aus:

npm install -g dts-gen
dts-gen -m <your-module>

Dies wird generiert your-module.d.ts im aktuellen Ordner.

Drücke die Schlummertaste

Wenn Sie einfach alles später erledigen und eine Weile auf Typen verzichten möchten, können Sie in TypeScript 2.0 jetzt schreiben

declare module "foo";

das wird dich lassen import Die "foo" Modul mit Typ any.Wenn Sie ein globales Problem haben, mit dem Sie sich später befassen möchten, schreiben Sie einfach

declare const foo: any;

was Ihnen eine geben wird foo Variable.

Andere Tipps

Sie können entweder verwenden tsc --declaration fileName.ts wie Ryan es beschreibt, oder Sie können es angeben declaration: true unter compilerOptionsin deinem tsconfig.json Vorausgesetzt, Sie hatten bereits eine tsconfig.json unter Ihrem Projekt.

Der beste Weg, um damit umzugehen (wenn keine Deklarationsdatei verfügbar ist, ist auf unbedingt )Schreiben Sie Erklärungen nur für die Dinge, die Sie anstelle der gesamten Bibliothek verwenden.Dies reduziert die Arbeit viel - und zusätzlich kann der Compiler dabei helfen, sich über fehlende Methoden zu beschweren.

Wie Ryan sagt, hat der TSC-Compiler einen Schalter --declaration was ein erzeugt .d.ts Datei von a .ts Datei.Beachten Sie außerdem, dass TypeScript (abgesehen von Fehlern) in der Lage sein soll, Javascript zu kompilieren, sodass Sie vorhandenen Javascript-Code an den TSC-Compiler übergeben können.

Wie in

Hier ist eine PowerShell, die eine einzelne TypeScript-Definitionsdatei und eine Bibliothek erstellt, die mehrere enthält *.js Dateien mit modernem JavaScript.

Ändern Sie zunächst alle Erweiterungen in .ts.

Get-ChildItem | foreach { Rename-Item $_ $_.Name.Replace(".js", ".ts") }

Zweitens verwenden Sie den TypeScript-Compiler, um Definitionsdateien zu generieren.Es wird eine Reihe von Compilerfehlern geben, die wir jedoch ignorieren können.

Get-ChildItem | foreach { tsc $_.Name  }

Zum Schluss alles vermischen *.d.ts Dateien in einem index.d.ts, entferne den import Anweisungen und das Entfernen der default aus jeder Exportanweisung.

Remove-Item index.d.ts; 

Get-ChildItem -Path *.d.ts -Exclude "Index.d.ts" | `
  foreach { Get-Content $_ } | `
  where { !$_.ToString().StartsWith("import") } | `
  foreach { $_.Replace("export default", "export") } | `
  foreach { Add-Content index.d.ts $_ }

Dies endet mit einem einzigen, nutzbaren index.d.ts Datei, die viele der Definitionen enthält.

Ich würde nach einer vorhandenen Mapping Ihrer 3. Partei-JS-Bibliotheken suchen, die Skript # oder Sharpkit unterstützen.Benutzer dieser C # zu .js Cross-Compiler haben das Problem, das Sie jetzt vorstellen konfrontiert haben, und haben möglicherweise ein Open-Source-Programm veröffentlicht, um Ihre 3. Partei LIB zu scannen und in Skeleton C # -Kläfchen umzuwandeln.Wenn ja, hacken Sie das Scanner-Programm, um Typecript anstelle von C # zu generieren.

Fehler nicht, wodurch eine C # -Poire-Schnittstelle für Ihren Drittanbieter-LIB in Mastercript-Definitionen übersetzt wird

Mein besonderes Interesse ist Sencha's Extjs Ria Framework, und ich weiß, dass es Projekte veröffentlicht haben, um eine c #-Interpretation für Skript # oder Sharpkit zu generieren.

Wenn Sie Ihre eigene Bibliothek erstellen, können Sie diese erstellen *.d.ts Dateien mithilfe der tsc (TypeScript-Compiler)-Befehl wie folgt:(vorausgesetzt, Sie bauen Ihre Bibliothek entsprechend auf dist/lib Ordner)

tsc -d --declarationDir dist/lib --declarationMap --emitDeclarationOnly
  • -d (--declaration):erzeugt die *.d.ts Dateien
  • --declarationDir dist/lib:Ausgabeverzeichnis für generierte Deklarationsdateien.
  • --declarationMap:Erzeugt eine Quellzuordnung für jede entsprechende „.d.ts“-Datei.
  • --emitDeclarationOnly:Geben Sie nur „.d.ts“-Deklarationsdateien aus.(kein kompiliertes JS)

(siehe die Dokumente für alle Befehlszeilen-Compiler-Optionen)

Oder zum Beispiel in Ihrem package.json:

"scripts": {
    "build:types": "tsc -d --declarationDir dist/lib --declarationMap --emitDeclarationOnly",
}

und dann ausführen: yarn build:types (oder npm run build:types)

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top