title: Trouble importing Cytoscape and Dagre in Js
body: <p>I'm trying to use Dagre with Cytoscape to visualize trees, but I'm having trouble when importing dagre and cytoscript in my javascript file. I keep getting an error &quot;import declarations may appear only at a top level of a module&quot;.</p>
  <p>My HTML:</p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang=&quot;en&quot;&gt;
      &lt;head&gt;
          &lt;title&gt;Document&lt;/title&gt;
          &lt;meta charset=&quot;UTF-8&quot;&gt;
          &lt;meta name=&quot;viewport&quot; content=&quot;width=device-width, initial-scale=1&quot;&gt;
          &lt;link href=&quot;style.css&quot; rel=&quot;stylesheet&quot;&gt;
      &lt;/head&gt;
      &lt;body&gt;
     
          &lt;div id=&quot;cy&quot;&gt;&lt;/div&gt;
  
          &lt;script src=&quot;tree.js&quot;&gt;&lt;/script&gt;
  
      &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>
  <p>My js file:</p>
  <pre><code>import cytoscape from 'cytoscape';
  import dagre from 'cytoscape-dagre';
  
  cytoscape.use( dagre );
  </code></pre>
  <p>When adding <code>type=&quot;module&quot;</code> to my script tag in HTML I get a MIME type error (text/html).</p>
  <p>I installed cytoscape-dagre via npm as per instructions on the Github repo: <code>npm install cytoscape-dagre</code>
  <a href="https://github.com/cytoscape/cytoscape.js-dagre" rel="nofollow noreferrer">https://github.com/cytoscape/cytoscape.js-dagre</a></p>
  <p>Appreciate any help.</p>