Question Modules ES6 dans les extensions en version Chrome 61


Ce n'est pas la même question que Modules ES6 dans le développement de l'extension Google Chrome (jeton inattendu) comme c'est à la fois obsolète et déjà répondu.

Google a publié un communiqué affirmant que Chrome prend en charge les modules ES6. J'essaie de charger un module depuis une extension. Je suis capable de charger un module depuis une page normale, mais pas depuis une extension.

Voici le HTML, c'est une page dans un contexte d'extension:

<script src="test.js" type="module"></script>

Lorsque j'ouvre la page, je vois le message d'erreur suivant dans la console:

Échec du chargement du script du module: le serveur a répondu avec un type MIME non-JavaScript "". La vérification stricte des types MIME est appliquée aux scripts de module par spécification HTML.

Est-ce que quelqu'un a des conseils? Est-ce un bug qui devrait être signalé à Chrome? Ou est-ce juste pas encore supporté? Je n'ai pas pu trouver d'explication simple.


11
2017-08-17 03:09


origine


Réponses:


En tant qu'utilisateur wxxOm mentionné dans les commentaires, voir https://crbug.com/738739.

9-18-17 mise à jour: https://bugs.chromium.org/p/chromium/issues/detail?id=769012 on dirait qu'il est en train d'être réparé!

10-19-17 mise à jour: https://bugs.chromium.org/p/chromium/issues/detail?id=728377#c18 signalé comme travaillant en chrome 64 (actuellement canari)

11-13-17 mise à jour: mise à jour finale, test dans Chrome 63, les modules fonctionnent maintenant. Notez que si vous avez besoin de charger un module dans la page d’arrière-plan de l’extension, vous ne pouvez pas le faire via la propriété scripts dans manifest.json, mais plutôt la page sur background.html, et spécifiez le module type dans la balise script. problème manifeste.


9
2017-08-28 20:55



Cela pourrait être un bug avec le chargement des fichiers locaux. J'ai réussi à créer une solution de contournement pour cela, mais vous aurez toujours une erreur dans la console et vous ne pouvez pas utiliser d'autres instructions d'importation en raison de problèmes d'origine, je suppose:

window.addEventListener('load', function () {
    function appendModule(code) {
        let url = URL.createObjectURL(new Blob([code], { type: 'text/javascript' })); // create url from code

        let script = document.createElement('script');
        script.type = 'module';
        script.src = url;
        document.head.appendChild(script);
    }

    let scripts = document.querySelectorAll('script');
    console.log(scripts);
    for (let script of scripts) {
        script.parentElement.removeChild(script);
        if (script.getAttribute('type') !== 'module') continue; // found normal script
        if (script.getAttribute('src') !== null) {
            // load a file
            var request = new XMLHttpRequest();
            request.open('GET', script.getAttribute('src') + '?_=' + Date.now(), true);
            request.onload = function () {
                if (this.status >= 200 && this.status < 400) {
                    // file loaded
                    appendModule(this.response);
                } else {
                    // error loading file
                    console.error('Not able to load module:', script.getAttribute('src'));
                }
            };
            request.onerror = function () {
                // error loading file
                console.error('Not able to load module:', script.getAttribute('src'));
            };
            request.send();
        }
    }
});
    <script src="./script.js" type="module"></script>

En bref: vous chargez le contenu du script, créez un Blob avec le type correct et le charger à partir d'un ObjectURL.


0
2017-09-13 16:24