title: identifying javascripy modules in html
body: <p>I have several JavaScript modules structured as shown below:</p>
  <pre><code>modules/
    main.js
    canvas.js
    shapes.js
    shapes/
      circle.js
      square.js
      triangle.js 
  </code></pre>
  <p>is main.js, canvas and shapes are imported. in shapes, circle,tringle, square modules are imported. I add a reference to main module in my HTML page like</p>
  <pre class="lang-html prettyprint-override"><code>&lt;script type=&quot;module&quot;src=&quot;./main.js&quot;/&gt; 
  </code></pre>
  <p>but it has this error:
  <code>Uncaught SyntaxError: Cannot use import statement outside a module</code>.</p>
  <p>can you help me? and can i don not add reference to child modules in html? for example I just add:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;script type=&quot;module&quot;src=&quot;./main.js&quot;/&gt;
  </code></pre>
  <p>in HTML and not identifying other modules in HTML.</p>