web-dev-qa-db-fra.com

Obtenir une exportation de jeton inattendue

J'essaie d'exécuter du code ES6 dans mon projet, mais j'obtiens une erreur inattendue d'exportation de jeton.

export class MyClass {
  constructor() {
    console.log("es6");
  }
}
javascriptecmascript-6webpackbabel
141
Jason

Vous utilisez la syntaxe du module ES6.

Cela signifie que votre environnement (par exemple, node.js) doit prendre en charge la syntaxe du module ES6.

NodeJS utilise la syntaxe du module CommonJS (module.exports) et non celle du module ES6 (mot clé export).

Solution:

  • Utilisez le package babel npm pour transpiler votre ES6 sur une cible commonjs

ou

  • Refactor avec la syntaxe CommonJS.
178
Phil Ricketts

Si vous obtenez cette erreur, cela pourrait également être lié à la manière dont vous avez inclus le fichier javascript dans votre page html. Lors du chargement de modules, vous devez déclarer explicitement ces fichiers en tant que tels. Voici un exemple:

//module.js:
function foo(){
   return "foo";
}

var bar = "bar";

export { foo, bar };

Lorsque vous incluez le script comme ceci:

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

Vous obtiendrez l'erreur:

Uncaught SyntaxError: exportation de jeton inattendue

Vous devez inclure le fichier avec un attribut type défini sur "module":

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

Et puis cela fonctionnera comme prévu et vous serez prêt à importer votre module dans un autre module:

import { foo, bar } from  "./module.js";

console.log( foo() );
console.log( bar );
74
Wilt

Pour utiliser ES6, ajoutez babel-preset-env

et dans votre .babelrc:

{
  "presets": ["@babel/preset-env"]
}

Réponse mise à jour grâce à @ghanbari comment appliquer babel 7.

8
Jalal

Installez les paquets babel @babel/core et @babel/preset qui convertiront ES6 en une cible commonjs car le noeud js ne comprend pas directement les cibles ES6.

npm install --save-dev @babel/core @babel/preset-env

Ensuite, vous devez créer un fichier de configuration avec le nom .babelrc dans le répertoire racine de votre projet et y ajouter ce code.

{ "presets": ["@babel/preset-env"] }

0
YouBee