Leider sind diese Dinge derzeit nicht sehr gut dokumentiert, aber selbst wenn Sie sie zum Laufen bringen konnten, gehen wir Ihre Konfiguration durch, damit Sie verstehen, was jedes Teil tut und wie es sich darauf bezieht, wie Typoskript Typisierungen verarbeitet und lädt.
Lassen Sie uns zuerst den Fehler durchgehen, den Sie erhalten:
error TS2688: Cannot find type definition file for 'lodash'.
Dieser Fehler ist eigentlich nicht auf Ihre Importe oder Referenzen oder Ihren Versuch zurückzuführen, lodash irgendwo in Ihren ts-Dateien zu verwenden. Vielmehr ist es aus einem Missverständnis zu kommen , wie die verwenden typeRootsund typesEigenschaften, so geht sie in ein wenig mehr Details über diese.
Das Besondere an typeRoots:[]und types:[]Eigenschaften ist, dass es sich NICHT um allgemeine Methoden zum Laden beliebiger declaration ( *.d.ts) - Dateien handelt.
Diese beiden Eigenschaften stehen in direktem Zusammenhang mit der neuen TS 2.0-Funktion, mit der Typisierungsdeklarationen aus NPM-Paketen verpackt und geladen werden können .
Dies ist sehr wichtig zu verstehen, dass diese nur mit Ordnern im NPM-Format funktionieren (dh einem Ordner, der eine package.json oder index.d.ts enthält ).
Der Standardwert für typeRootsist:
{
"typeRoots" : ["node_modules/@types"]
}
Standardmäßig bedeutet dies, dass Typoskript in den node_modules/@typesOrdner verschoben wird und versucht, jeden dort gefundenen Unterordner als npm-Paket zu laden .
Es ist wichtig zu verstehen, dass dies fehlschlägt, wenn ein Ordner keine npm-paketähnliche Struktur hat.
Dies ist, was in Ihrem Fall passiert, und die Quelle Ihres anfänglichen Fehlers.
Sie haben typeRoot auf Folgendes umgestellt:
{
"typeRoots" : ["./typings"]
}
Dies bedeutet, dass Typoskript jetzt den ./typingsOrdner nach Unterordnern durchsucht und versucht, jeden gefundenen Unterordner als npm-Modul zu laden.
typeRootsStellen wir uns also vor, Sie hätten gerade ein Setup, auf das Sie verweisen ./typingskönnten , aber noch kein types:[]Eigenschafts-Setup. Sie würden wahrscheinlich diese Fehler sehen:
error TS2688: Cannot find type definition file for 'custom'.
error TS2688: Cannot find type definition file for 'global'.
Dies liegt daran , tscwird die Scan - ./typingsOrdner und die Suche nach den Unterordner customund global. Es wird dann versucht, diese als Typisierung vom Typ npm zu interpretieren, aber es gibt keine index.d.tsoder package.jsonin diesen Ordnern, und Sie erhalten den Fehler.
Lassen Sie uns nun ein wenig über die types: ['lodash']Eigenschaft sprechen, die Sie festlegen. Was macht das? Standardmäßig lädt Typoskript alle Unterordner, die es in Ihrem findet typeRoots. Wenn Sie eine types:Eigenschaft angeben , werden nur diese bestimmten Unterordner geladen.
In Ihrem Fall weisen Sie es an, den ./typings/lodashOrdner zu laden, aber er existiert nicht. Deshalb erhalten Sie:
error TS2688: Cannot find type definition file for 'lodash'
Fassen wir also zusammen, was wir gelernt haben. Typescript 2.0 wurde eingeführt typeRootsund typeszum Laden von Deklarationsdateien in npm-Paketen . Wenn Sie benutzerdefinierte Typisierungen oder einzelne lose d.tsDateien haben, die nicht in einem Ordner enthalten sind, der den Konventionen des npm-Pakets entspricht, sind diese beiden neuen Eigenschaften nicht das, was Sie verwenden möchten. Typescript 2.0 ändert nicht wirklich, wie diese verbraucht werden. Sie müssen diese Dateien nur auf eine der vielen Standardmethoden in Ihren Kompilierungskontext aufnehmen:
Direkt in eine .tsDatei aufnehmen:
///<reference path="../typings/custom/lodash.d.ts" />
Einschließlich ./typings/custom/lodash.d.tsin Ihrem files: []Eigentum.
Einschließen ./typings/index.d.tsin Ihre files: []Eigenschaft (die dann rekursiv die anderen Typisierungen enthält.
Hinzufügen ./typings/**zu Ihremincludes:
Anhand dieser Diskussion können Sie hoffentlich feststellen, warum die Änderungen, die Sie an Ihren tsconfig.jsonvorgenommenen Dingen vorgenommen haben, wieder funktionieren.
BEARBEITEN:
Eine Sache, die ich vergessen habe zu erwähnen, ist, dass typeRootsund typesEigenschaft wirklich nur zum automatischen Laden globaler Deklarationen nützlich sind .
Zum Beispiel, wenn Sie
npm install @types/jquery
Wenn Sie die Standard-tsconfig verwenden, wird das Paket jquery types automatisch geladen und $ist in allen Ihren Skripten verfügbar, ohne dass Sie weitere Schritte ausführen müssen ///<reference/>oderimport
Die typeRoots:[]Immobilie soll von weiteren Standorten hinzufügen , wo Typ - Pakete werden automatisch geladen frrom werden.
Der types:[]Hauptanwendungsfall der Eigenschaft besteht darin, das automatische Ladeverhalten zu deaktivieren (indem Sie es auf ein leeres Array setzen) und dann nur bestimmte Typen aufzulisten, die Sie global einschließen möchten.
Die andere Möglichkeit, Typpakete aus den verschiedenen zu laden, typeRootsist die Verwendung der neuen ///<reference types="jquery" />Direktive. Beachten Sie die typesstatt path. Dies ist wiederum nur für globale Deklarationsdateien nützlich, normalerweise solche, die dies nicht tun import/export.
Hier ist eines der Dinge, die Verwirrung stiften typeRoots. Denken Sie daran, ich sagte, dass typeRootses um die globale Einbeziehung von Modulen geht. Ist @types/folderaber auch an der Standardmodulauflösung beteiligt (unabhängig von Ihrer typeRootsEinstellung).
Insbesondere explizit den Import Module umgeht immer alle includes, excludes, files, typeRootsund typesOptionen. Also, wenn Sie tun:
import {MyType} from 'my-module';
Alle oben genannten Eigenschaften werden vollständig ignoriert. Die relevanten Eigenschaften während Modul Auflösung sind baseUrl, pathsund moduleResolution.
Grundsätzlich bei der Verwendung von nodeModul - Auflösung, wird es die Suche nach einem Dateinamen beginnen my-module.ts, my-module.tsx, my-module.d.tsin dem Ordner starten , auf dem die baseUrlKonfiguration.
Wenn die Datei nicht gefunden wird, sucht sie nach einem Ordner mit dem Namen my-moduleund sucht dann nach einem package.jsonmit einer typingsEigenschaft. Wenn sich darin eine Eigenschaft befindet package.jsonoder nicht, die typingsangibt, welche Datei geladen werden soll, wird index.ts/tsx/d.tsin diesem Ordner gesucht .
Wenn dies immer noch nicht erfolgreich ist, wird im node_modulesOrdner, der bei Ihnen beginnt, nach denselben Dingen gesucht baseUrl/node_modules.
Wenn diese nicht gefunden werden, wird außerdem nach baseUrl/node_modules/@typesdenselben Dingen gesucht .
Wenn es immer noch nichts findet , wird es beginnen , das übergeordnete Verzeichnis zu gehen und suchen node_modulesund node_modules/@typesdort. Es wird die Verzeichnisse weiter durchsuchen, bis es das Stammverzeichnis Ihres Dateisystems erreicht (sogar Knotenmodule außerhalb Ihres Projekts).
Eine Sache, die ich hervorheben möchte, ist, dass die Modulauflösung alle von typeRootsIhnen festgelegten Einstellungen vollständig ignoriert . Wenn Sie also konfiguriert haben typeRoots: ["./my-types"], wird dies während der expliziten Modulauflösung nicht durchsucht. Es dient nur als Ordner, in dem Sie globale Definitionsdateien ablegen können, die Sie der gesamten Anwendung zur Verfügung stellen möchten, ohne dass Sie sie erneut importieren oder referenzieren müssen.
Zuletzt können Sie das Modulverhalten mit Pfadzuordnungen (dh der pathsEigenschaft) überschreiben . So habe ich zum Beispiel erwähnt, dass typeRootsbeim Versuch, ein Modul aufzulösen , keine benutzerdefinierten Benutzer berücksichtigt werden. Aber wenn Sie möchten, können Sie dieses Verhalten folgendermaßen ausführen:
"paths" :{
"*": ["my-custom-types/*", "*"]
}
Versuchen Sie für alle Importe, die mit der linken Seite übereinstimmen, den Import wie auf der rechten Seite zu ändern, bevor Sie versuchen, ihn einzuschließen ( *die rechte Seite repräsentiert Ihre anfängliche Importzeichenfolge. Wenn Sie beispielsweise importieren:
import {MyType} from 'my-types';
Es würde zuerst den Import versuchen, als ob Sie geschrieben hätten:
import {MyType} from 'my-custom-types/my-types'
Und wenn es dann nicht gefunden wird, versucht es es erneut ohne das Präfix (das zweite Element im Array ist genau *das, was den ersten Import bedeutet.
Auf diese Weise können Sie zusätzliche Ordner hinzufügen, um nach benutzerdefinierten Deklarationsdateien oder sogar nach benutzerdefinierten .tsModulen zu suchen , die Sie verwenden möchten import.
Sie können auch benutzerdefinierte Zuordnungen für bestimmte Module erstellen:
"paths" :{
"*": ["my-types", "some/custom/folder/location/my-awesome-types-file"]
}
Dies würde dich tun lassen
import {MyType} from 'my-types';
Aber dann lesen Sie diese Typen aus some/custom/folder/location/my-awesome-types-file.d.ts
pathsund wie unterscheidet es sichincludezum Zwecke der Eingabe?