ES6 module d'Importation de donner “Uncaught SyntaxError: Unexpected identificateur”

Pour un projet personnel, je suis en train d'utiliser ES6 importation d'écrire plus propre code. Comme premier test, je suis en train d'écrire un objet qui devrait générer un menu. L'ensemble du code est de travailler quand je suis directement le chargement de la classe, mais lors de l'utilisation de l'importation et l'exportation dans l'ES6, il donne un "Uncaught SyntaxError: Unexpected identificateur" erreur sur la import ligne dans main.js

J'ai les fichiers suivants:

assets/js/menu.module.js

'use strict';

export default class Menu
{ ... }

assets/js/main.js

import Menu from "./menu.module.js";

window.addEventListener('DOMContentLoaded', () => {
    const menu = new Menu();
});

index.html

<script type="module" src="assets/js/menu.module.js"></script>
<script src="assets/js/main.js">

Noter que ce sont uniquement les lignes de code.

À l'aide de la <script type="module"> ligne ou non ne semble pas faire toute la différence pour moi. J'ai à la fois le chrome drapeaux à des fins expérimentales et ES6 les Modules activés, et que, sans eux, j'ai reçu un message d'erreur à propos de import n'est pas définie.

Version de Chrome serait de 62, donc, selon différentes sources (y compris google, mise à jour du journal lui-même), il convient de travailler, même sans les drapeaux.

Quelqu'un peut-il m'éclairer que de pourquoi cela ne fonctionne pas, et ce que je fais de mal?

Est-il associé à un numéro de ligne? Quel fichier est l'erreur?
oublié d'ajouter que, Juste ajouté maintenant. C'est sur le import ligne dans main.js
Ne devrait pas main.js besoin type="module" ainsi? Il utilise le module de syntaxe, après tout.
Votre window.addEventListener( appel manque une parenthèse fermante
Qui semblait avoir résolu le problème. Merci 🙂

OriginalL'auteur ZeroThe2nd | 2017-12-04

  1. 36

    @Bergi mentionnées dans le commentaire, l'ajout de type="module" à la main.js ligne d'importation a résolu le problème. Tout fonctionne maintenant.

    Merci à vous tous qui avez répondu et j'ai essayé de l'aider.

    OriginalL'auteur ZeroThe2nd

  2. 2

    De ce que je peux voir que vous essayez de charger le fichier menu.module.js alors qu'il est en fait le nom menu.js.

    PS: D'après ce que je me souviens de vous pourrait également tomber le .js de l'instruction d'importation.

    J'ai eu une situation similaire, mais je suis à l'aide de php, d'injecter un script. Je suis le seul à l'aide de vanille javascript et j'avais besoin de mettre le ".js" extension sur mon importation pour que cela fonctionne. Je sais à Réagir .js extension n'est pas nécessaire, mais je devine que cela va varier en fonction de l'environnement dans lequel vous travaillez. Espérons que cela aide quelqu'un d'autre.

    OriginalL'auteur Marcel Krause