title: "Uncaught SyntaxError: import not found: default" works in one module and not in another
body: <p>I have two javascript files which are both used in the same web page and which both use the resources of a third javascript file.</p>
  <p>The main JS file Person6.js, at /FamilyTree/Person6.js on the webserver:</p>
  <pre class="lang-js prettyprint-override"><code>import HTTP from &quot;../jscripts6/js20/http.js&quot;;
  import {iframe, actMouseOverHelp, openFrame, openSignon, debug, args,
          getOffsetLeft, getOffsetTop, popupAlert, show,
          showHelp, hideHelp, helpElt, keyDown,
          eltMouseOver, eltMouseOut}
              from &quot;../jscripts6/util.js&quot;;
  import {capitalize} from &quot;../jscripts6/CommonForm.js&quot;;
  import Cookie from &quot;../jscripts6/Cookie.js&quot;;
  </code></pre>
  <p>and CommonForm.js, at /jscripts6/CommonForm.js on the web server, which you see has one method imported by the main script.</p>
  <pre class="lang-js prettyprint-override"><code>import HTTP from &quot;../jscripts6/js20/http.js&quot;;
  import {getOffsetLeft, getOffsetTop, popupAlert, 
          helpDiv, eltMouseOver, eltMouseOut, displayHelp}
              from &quot;../jscripts6/util.js&quot;;
  </code></pre>
  <p>When I run eslint over each of these files individually there are no problems reported except undefined resources which are declared in scripts which are incorporated in the application through  tags:</p>
  <pre class="lang-html prettyprint-override"><code>    &lt;script src=&quot;/jscripts/tinymce/js/tinymce/tinymce.js&quot; type=&quot;application/javascript&quot;&gt;
      &lt;/script&gt;
      &lt;script src=&quot;/FamilyTree/Person6.js&quot; type=&quot;module&quot;&gt;
      &lt;/script&gt;
      &lt;script async defer src=&quot;https://maps.googleapis.com/maps/api/js?v=3.43&amp;callback=initializeMaps&amp;region=$GOOGLECC&amp;key=$GOOGLEKEY&quot; type=&quot;application/javascript&quot;&gt;&lt;/script&gt;
  </code></pre>
  <p>I am getting an error:</p>
  <pre><code>Uncaught SyntaxError: import not found: default CommonForm.js:157:7.
  </code></pre>
  <p>line 157 is import HTTP from &quot;../jscripts6/js20/http.js&quot;; as shown above.</p>
  <p>Why is this statement a syntax error when it is embedded in CommonForm.js, but not when it is embedded in the main file Person6.js?  There is nothing in front of the imports in either file but comments.  Apparently because of this error in the imported file the main file is never executed.  I put an alert just after the imports and it did not pop.</p>
  <p>I am trying to migrate my code from ES3 to ES6.  How do I fix this error?</p>