136 votes

ES2015 importation ne fonctionne pas (même à haut niveau) dans Firefox

Ce sont mes fichiers d'exemple:

<!DOCTYPE html>
<html>
<head>
  <title>Test</title>
  <script src="t1.js"></script>
</head>
<body></body>
</html>

t1.js:

import Test from 't2.js';

t2.js:

export const Test = console.log("Hello world");

Lorsque je charge la page dans Firefox 46, il retourne "SyntaxError: déclarations d'importation ne peut apparaître au premier niveau d'un module" - mais je ne suis pas sûr de savoir comment beaucoup plus haut-niveau de l'instruction d'importation pouvez obtenir ici. Est-ce une erreur de red herring, et importer/exporter tout simplement pas encore pris en charge?

179voto

Tomáš Zato Points 4901

En fait, l'erreur qu'on a eu est parce que vous avez besoin à indiquer que vous êtes en train de charger un module, que l'utilisation de modules, est autorisé:

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

Je l'ai trouvé dans ce document sur l'utilisation de ES6 d'importation dans le navigateur. Lecture recommandée.

Entièrement pris en charge dans les versions de navigateur (et plus tard; liste complète sur caniuse.com):

  • Firefox 60
  • Chrome (pc de bureau) 65
  • Chrome (android) 66
  • Safari 1.1

Dans les navigateurs plus anciens, vous devrez peut-être permettre à certains drapeaux dans les navigateurs:

  • Google Chrome Canary 60 – derrière le Web Expérimentale Plate-forme de drapeau en chrome:flags.
  • Firefox 54 – dom.moduleScripts.enabled réglage en about:config.
  • Edge 15 – derrière le Expérimentales les Fonctions JavaScript de réglage en about:flags.

Rappelons tout de même que ES6 les importations sont pas largement pris en charge, mais sont certainement une grande dans le développement afin de vous faire économiser temps passé par la compilation du projet avec webpack.

19voto

Josh Beam Points 7825

Ce n'est pas précis plus. Tous les navigateurs prennent désormais en charge ES6 modules

Réponse originale à cette question ci-dessous

D' import sur MDN:

Cette fonctionnalité n'est pas implémentée dans tous les navigateurs en mode natif en ce moment. Il est mis en œuvre dans de nombreux transpilers, tels que le Traceur Compilateur, Babel ou Cumulatif.

Les navigateurs ne prennent pas en charge import.

Ici est la prise en charge du navigateur de la table:

enter image description here

Si vous souhaitez importer ES6 modules, je conseille un transpiler (par exemple, babel).

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X