title: How to use JavaScript import/export without node.js?
body: <p>The following code worked when run using Visual Studio Code live server. But threw an error when run as distinct file.
  I tested it online on my web site and in place of  './course.js' and  './student.js' with the full URL path and the error returned were:</p>
  
  <pre><code>Cross-Origin Request Blocked: The Same Origin Policy disallows readin the remote resource at .... (Reason: CORS header 'Access-Control-Allow-Origin' missing).
  </code></pre>
  
  <p>and</p>
  
  <pre><code>Loading module from “...” was blocked because of a disallowed MIME type (“application/octet-stream”)
  </code></pre>
  
  <p>In a different iteration in which I used che to set the request  header to allow CORS I was still unable to run the code properly as the browser returned  the following error:</p>
  
  <pre><code>  SyntaxError: export declarations may only appear at top level of a module
  </code></pre>
  
  <p>Please keep in mind that I am not using node.js, nor any form of server side rendering, but rather trying to import code without having to add  for each JS  file.</p>
  
  <p>Example</p>
  
  <p>File 1 (course.js)</p>
  
  <pre><code>export function Course() {
     this.name = '';
  }
  </code></pre>
  
  <p>File 2 (student.js)</p>
  
  <pre><code>import { Course } from './course.js';
  
  export function Student() {
     this.course = new Course();
  }
  </code></pre>
  
  <p>File 3 (index.html)</p>
  
  <pre><code>&lt;html ...
  &lt;body&gt;
      &lt;script type='module'&gt;
          import { Student } from './student.js';
  
          var x = new Student();
          x.course.name = 'xxx';
          console.log(x.course.name)
     &lt;/script&gt;
   ....
  </code></pre>