title: ES6 module Import giving "Uncaught SyntaxError: Unexpected identifier"
body: <p>For a personal project, I'm trying to use ES6 import to write cleaner code. As first test, I'm writing an object that should generate a menu. The whole code is working when I'm directly loading up the class, yet when using the import and export in ES6, it gives an "Uncaught SyntaxError: Unexpected identifier" error on the <code>import</code> line in <code>main.js</code></p>
  
  <p>I've got the following files:</p>
  
  <p><strong>assets/js/menu.module.js</strong></p>
  
  <pre><code>'use strict';
  
  export default class Menu
  { ... }
  </code></pre>
  
  <p><strong>assets/js/main.js</strong></p>
  
  <pre><code>import Menu from "./menu.module.js";
  
  window.addEventListener('DOMContentLoaded', () =&gt; {
      const menu = new Menu();
  });
  </code></pre>
  
  <p><strong>index.html</strong></p>
  
  <pre><code>&lt;script type="module" src="assets/js/menu.module.js"&gt;&lt;/script&gt;
  &lt;script src="assets/js/main.js"&gt;
  </code></pre>
  
  <p>Note that these are only the relevant lines of code.</p>
  
  <p>Using the <code>&lt;script type="module"&gt;</code> line or not did not seem to make any difference for me. I do have both the chrome flags for experimental and ES6 Modules enabled, as without them I received an error about <code>import</code> not being defined.</p>
  
  <p>Chrome version would be 62, so according to different sources (including google's update log itself) this should be working, even without the flags.</p>
  
  <p>Can anyone enlighten me as of why this is not working, and what I am doing wrong?</p>