title: How to include a npm package in an HTML file?
body: <p>My HTML file:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;head&gt;
      ...
  &lt;/head&gt;
  &lt;body&gt;
      ...
      &lt;script src="script.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  </code></pre>
  
  <p>My JavaScript file - <code>script.js</code>:</p>
  
  <pre class="lang-js prettyprint-override"><code>import * as FilePond from 'filepond';
  
  const myPond = FilePond.create({
      multiple: false,
      name: 'filepond'
  });
  
  document.body.appendChild(pond.element);
  </code></pre>
  
  <p>But error occurred, the browser said:</p>
  
  <pre><code>Uncaught SyntaxError: Cannot use import statement outside a module
  </code></pre>
  
  <p>So I edited the script.js into this:</p>
  
  <pre class="lang-js prettyprint-override"><code>const FilePon = require('filepond')
  
  const myPond = FilePond.create({
      multiple: false,
      name: 'filepond'
  });
  
  document.body.appendChild(pond.element);
  </code></pre>
  
  <p>But error occurred again, the browser said:</p>
  
  <pre><code>Uncaught ReferenceError: require is not defined at script.js:1
  </code></pre>
  
  <p>How can I fix it?</p>