import.meta.resolve() ist eine eingebaute Funktion, die auf demimport.meta-Objekt eines JavaScript-Moduls definiert ist. Sie löst einen Modulspezifizierer zu einer URL auf, indem sie die URL des aktuellen Moduls als Basis verwendet.

Syntax

import.meta.resolve(moduleName)

Parameter

moduleName

Ein String, der ein potenziell importierbares Modul spezifiziert. Dies kann ein relativer Pfad (wie"./lib/helper.js"), ein einfacher Name (wie"my-module") oder eine absolute URL (wie"https://example.com/lib/helper.js") sein.

Rückgabewert

Gibt einen String zurück, der dem Pfad entspricht, der importiert würde, wenn das Argument animport() übergeben würde.

Beschreibung

import.meta.resolve() ermöglicht es einem Skript, auf denModulspezifizierer-Auflösungsalgorithmus für einen Namen zuzugreifen, wie folgt:

// Script at https://example.com/main.jsconst helperPath = import.meta.resolve("./lib/helper.js");console.log(helperPath); // "https://example.com/lib/helper.js"

Beachten Sie, dassimport.meta.resolve() nur die Auflösung durchführt und nicht versucht, den resultierenden Pfad zu laden oder zu importieren. Daher ist der Rückgabewert identisch,unabhängig davon, ob der zurückgegebene Pfad einer existierenden Datei entspricht und unabhängig davon, ob diese Datei gültigen Code für ein Modul enthält. Dies ermöglicht es, dassimport.meta.resolve() einesynchron Operation ist.

Es unterscheidet sich vomdynamischen Import, denn obwohl beide ein Modulspezifizierer als erstes Argument akzeptieren, gibtimport.meta.resolve() den Pfad zurück, derimportiert werden würde, ohne zu versuchen, auf diesen Pfad zuzugreifen. Daher sind die beiden folgenden effektiv derselbe Code:

// Approach 1console.log(await import("./lib/helper.js"));// Approach 2const helperPath = import.meta.resolve("./lib/helper.js");console.log(await import(helperPath));

Jedoch, selbst wenn"./lib/helper.js" nicht erfolgreich importiert werden kann, wird der zweite Ausschnitt keinen Fehler begegnen, bis er versucht, den Import in Zeile 2 durchzuführen.

Bare Modulnamen

Sie können einen einfachen Modulnamen (auch bekannt als einfacher Modulspezifizierer) animport.meta.resolve() übergeben, solange die Modulauflösung für den Namen definiert ist. Zum Beispiel können Sie dies in einem Browser mithilfe einerImportkarte definieren:

<!-- index.html --><script type="importmap">  {    "imports": {      "my-module": "./modules/my-module/index.js"    }  }</script><script type="module">  const moduleEntryPath = import.meta.resolve("my-module");  console.log(moduleEntryPath);</script>

Da dieser Codeausschnitt nicht versucht,moduleEntryPath zu importieren — ebenso wenig die Importkarte — wird die aufgelöste URL angezeigt, unabhängig davon, ob./modules/my-module/index.js tatsächlich existiert.

Vergleich mit neuem URL()

DerURL()-Konstruktor akzeptiert ein zweites Argument alsBasis-URL. Wenn das erste Argument ein relativer Pfad ist und die Basis-URLimport.meta.url ist, ist der Effekt ähnlich wie beiimport.meta.resolve().

const helperPath = new URL("./lib/helper.js", import.meta.url).href;console.log(helperPath);

Dies ist auch eine nützliche Ersetzungssyntax, wenn ältere Browser unterstützt werden sollen. Es gibt jedoch einige Unterschiede:

• import.meta.resolve() gibt einen String zurück, währendnew URL() einURL-Objekt zurückgibt. Es ist möglich,href odertoString() auf die konstruierteURL anzuwenden, aber dies könnte in einigen JavaScript-Umgebungen oder beim Einsatz von Tools wie Bundlern, um den Code statisch zu analysieren, immer noch nicht dasselbe Ergebnis liefern.
• import.meta.resolve() ist sich zusätzlicher Auflösungskonfigurationen bewusst, wie z.B. dem Auflösen einfacher Modulnamen unter Verwendung von Importkarten, wie oben beschrieben.new URL() ist sich Importkarten nicht bewusst und behandelt einfache Modulnamen als relative Pfade (d.h.new URL("my-module", import.meta.url) bedeutetnew URL("./my-module", import.meta.url)).

Einige Tools erkennennew URL("./lib/helper.js", import.meta.url).href als Abhängigkeit von"./lib/helper.js" (ähnlich wie ein Import) und berücksichtigen dies bei Funktionen wie Bündelung, Import-Umschreibung für verschobene Dateien, "Gehe zu Quelle"-Funktionalität usw. Daimport.meta.resolve() jedoch weniger mehrdeutig ist und speziell entwickelt wurde, um eine Abhängigkeitsauflösung des Modulpfads anzuzeigen, sollten Sieimport.meta.resolve(moduleName) anstelle vonnew URL(moduleName, import.meta.url) für diese Anwendungsfälle verwenden, wann immer möglich.

Kein ECMAScript-Feature

import.meta.resolve() ist nicht imECMAScript-Spezifikation für JavaScript-Module spezifiziert oder dokumentiert. Stattdessen definiert die Spezifikationdasimport.meta-Objekt, lässt jedochalle seine Eigenschaften als "host-definiert". Der WHATWG HTML-Standard übernimmt dort, wo der ECMAScript-Standard aufhört, unddefiniertimport.meta.resolve unter Verwendung derModulspezifizierer-Auflösung.

Das bedeutet, dassimport.meta.resolve() nicht von allen konformen JavaScript-Implementierungen implementiert werden muss. Allerdings kannimport.meta.resolve() auch in nicht-browserbasierten Umgebungen verfügbar sein:

• Deno implementiertKompatibilität mit dem Browserverhalten.
• Node.js implementiert ebenfallsdieimport.meta.resolve() Funktion, fügt jedoch einen zusätzlichenparent-Parameter hinzu, wenn Sie das--experimental-import-meta-resolve Flag verwenden.

Beispiele

Einen Pfad für den Worker()-Konstruktor auflösen

import.meta.resolve() ist besonders wertvoll für APIs, die einen Pfad zu einer Skriptdatei als Argument nehmen, wie derWorker() Konstruktor:

// main.jsconst workerPath = import.meta.resolve("./worker.js");const worker = new Worker(workerPath, { type: "module" });worker.addEventListener("message", console.log);

// worker.jsself.postMessage("hello!");

Dies ist auch nützlich, um Pfade für andere Worker zu berechnen, wieDienstmitarbeiter undgeteilte Mitarbeiter. Allerdings, wenn Sie einen relativen Pfad verwenden, um die URL eines Dienstmitarbeiters zu berechnen, bedenken Sie, dass das Verzeichnis des aufgelösten Pfades standardmäßig seinenRegistrierungsbereich bestimmt (obwohl ein anderer Bereichwährend der Registrierung angegeben werden kann).

Spezifikationen

Browser-Kompatibilität

Siehe auch

• import
• import()
• import.meta