Erstellen Sie eine Website, die ES-Module verwendet und dennoch lokal gespeichert werden kann ⇐ HTML

[Anonymous]

Ist es möglich, eine einseitige Website zu erstellen, die auf statischem Hosting gehostet wird (keine benutzerdefinierten Header usw.), die ES-Module in externen .js-Dateien verwendet und trotzdem im Browser als „Website, vollständig“ gespeichert werden und lokal funktionieren kann?
Mit klassischem JS oder beim Transpilieren der ES-Module funktioniert es, wenn Sie etwas Vorsicht walten lassen (z. B. beachten Sie, dass der Browser das DOM möglicherweise im aktuellen Zustand speichert und nicht). das erste, und stellen Sie sicher, dass auf alle Bilder verwiesen wird, auch wenn sie noch nicht angezeigt werden).
Bei ES-Modulen sehe ich jedoch zwei Probleme. Wenn sie in einer „Importmap“ referenziert werden, werden sie überhaupt nicht heruntergeladen. Und wenn sie als einzelne -Tags referenziert werden, werden sie heruntergeladen, können aber aufgrund der CORS-Richtlinie (die das Laden von ES-Modulen aus Datei--URIs nicht zulässt) nicht geladen werden.
Gibt es eine Problemumgehung oder muss ich damit leben, dass ich entweder ES-Module im Browser verwenden kann (wodurch die Funktion „Seite speichern unter“ unterbrochen wird) oder die gesamte Seite in die klassische Version umwandeln muss JavaScript, wenn ich möchte, dass es nach dem Herunterladen weiterhin funktioniert?
Minimalbeispiel

Code: Select all

module.js

:[/b]

Code: Select all

export function getTitle() {
return "The answer is 42";
}

Code: Select all

index.html

:[/b]

Code: Select all

Test page

{ "imports": { "title": "./module.js" } }



import { getTitle } from "title";

window.addEventListener("load", function() {
document.getElementById("title").innerText = getTitle();
document.title = getTitle();
document.body.addEventListener("click", function() {
alert(getTitle());
});
});



Here comes the title

Wenn Sie dies mit npx http-server oder python3 -m http.server hosten und es dann als Webseite herunterladen, komplett mit Firefox, Chrome oder Edge, fehlt das Skriptmodul. Auch beim Download als MHT mit Chrome oder Edge (Firefox bietet diese Option nicht) ist das Skriptmodul nicht enthalten. Wenn Sie diese heruntergeladene Datei als Datei-URL öffnen (oder im Datei-Explorer darauf doppelklicken) in einem der genannten Browser, funktioniert die Seite nicht.
Verhalten beim Laden vom http-Server:

• Die Beschriftungen (Titel und h1) werden durch Inhalte aus dem Modul ersetzt
• Ein Klick auf die Beschriftung zeigt eine Warnung mit Inhalten aus dem an Modul

Verhalten beim Speichern als Datei und Laden von der Festplatte (Dateiprotokoll):

• Die Beschriftungen werden bereits in der gespeicherten HTML-Datei ersetzt
• JavaScript-Fehler aufgrund von CORS-Fehler beim Laden des Moduls
• Der Klick funktioniert nicht als Das Modul ist nicht geladen

Erwartung (oder zumindest Hoffnung)

• Gespeicherte Datei verhält sich genauso wie die Online-Version (gehostet auf einem http-Server).

Erwartete Antworten (mögliche Optionen, vielleicht ist die richtige Antwort anders)

• Das wird nie funktionieren, es ist kein Fehler und es gibt keine Problemumgehung (Bonuspunkte, wenn Quellen wie abgelehnte Fehler oder Spezifikationen zitiert werden könnten)
• Dies ist ein bestätigter Fehler (mit Fehlernummer) [Ich konnte keinen finden]
• Sie können die Datei auf diese oder jene Weise ändern und es wird funktionieren.