Moduł ES6 Importowanie z napisem "Uncaught SyntaxError: nieoczekiwany identyfikator"

Question

Dla osobistego projektu próbuję użyć importu ES6 do napisania czystszego kodu. Jako pierwszy test piszę obiekt, który powinien generować menu. Cały kod działa, gdy jestem bezpośrednio ładuje się klasę, ale podczas korzystania z przywóz i wywóz w ES6, daje „Uncaught SyntaxError: nieoczekiwany identyfikator” błąd na linii import w main.js

mam następujące pliki:

aktywa/js/menu.js

'use strict'; 

export default class Menu 
{ ... } 

aktywa/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"> 

Należy pamiętać, że są to tylko odpowiednie linie kodu.

Korzystanie z linii <script type="module"> lub nie wydawało się dla mnie żadnej różnicy. Mam włączone zarówno flagi chrome dla modułów eksperymentalnych, jak i ES6, ponieważ bez nich otrzymałem komunikat o błędzie o braku zdefiniowania import.

Wersja Chrome miałaby 62 lata, więc według różnych źródeł (w tym samego dziennika aktualizacji Google), powinna działać, nawet bez flag.

Czy ktoś może mnie oświecić z tego, dlaczego to nie działa i co robię źle?

Answer 1

Jak wspomniano w komentarzu @Bergi, dodanie linii type="module" do linii importu rozwiązało problem. Wszystko działa teraz.

Dziękuję wszystkim, którzy odpowiedzieli i próbowali pomóc.

Answer 2

Z tego co widzę, próbujesz załadować plik menu.module.js, podczas gdy faktycznie ma on nazwę menu.js.

PS: Z tego, co pamiętam, można również usunąć .js z wyrażenia import.