Wie kann ich ES6-Module in ein Chrome-Erweiterungsinhaltsskript importieren?

So importieren Sie ES6-Module in Inhaltsskripte für die Chrome-Erweiterung

Hintergrund

In Chrome 61 wurde die Unterstützung für JavaScript-Module eingeführt. Da diese Frage im Jahr 2018 gestellt wurde, ist die aktuelle Version von Chrome viel neuer, sodass ihre Vorschläge möglicherweise veraltet sind. Daher untersucht dieser Artikel aktuelle Lösungen für das vorliegende Problem.

Aktuelle Ansätze

Asynchrone dynamische import()-Funktion für ES-Module

Diese Methode ermöglicht das Importieren von Modulen aus einer vertrauenswürdigen Quelle und behält den Zugriff auf globale Variablen und Funktionen des anfänglichen Inhaltsskripts bei. Aufgrund eines bekannten Problems in Chrome kann es jedoch vom Servicemitarbeiter der Website blockiert werden.

Synchroner „Import“-Workaround für normale Nicht-Modul-Skripte

Diese Methode nutzt Nicht-Modul-Skripte, fügt deren Namen dem „js“-Array in „content_scripts“ hinzu und verweist dann auf die globalen Variablen/Funktionen direkt.

Weitere Informationen

• So verwenden Sie den ES6-„Import“ mit der Chrome-Erweiterung: https://stackoverflow.com/questions/48277565/how-to-import-es6- module-in-content-script-for-chrome-extension
• Arbeitsbeispiel für den ES6-Import in die Chrome-Erweiterung: https://github.com/TheSavior/chrome-extension-es6-tips
• chrome.runtime.getURL: https://developer.chrome.com/docs/extensions/reference/runtime/#method- getURL

Das obige ist der detaillierte Inhalt vonWie kann ich ES6-Module in ein Chrome-Erweiterungsinhaltsskript importieren?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!