Почему Stats.min. js можно импортировать только с помощью `script src =`, но не `import`?

Question

У меня есть Javascript кодов, как показано ниже. Когда импорт находится внутри <script src="..."></script>, он работает. Однако, если я переместил импорт в import ...;, это не сработает. Сообщение об ошибке: «Неперехваченная ошибка ReferenceError: статистика не определена».

Почему? Поскольку я работаю над сайтом Jekyll, я предпочитаю использовать способ import ...;, чтобы убедиться, что другие элементы сайта работают. Есть идеи, как сделать способ import ...; без ошибок?

Работает

  <div id="stats"></div>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/stats.js/r16/Stats.min.js"></script>

  <script type="module">

  const stats = new Stats()
  stats.setMode(0)
  document.getElementById('stats').appendChild(stats.domElement)
  </script>

Не работает

  <div id="stats"></div>

  <script type="module">
  import 'https://cdnjs.cloudflare.com/ajax/libs/stats.js/r16/Stats.min.js';

  const stats = new Stats()
  stats.setMode(0)
  document.getElementById('stats').appendChild(stats.domElement)
  </script>

Answer 1

import позволяет импортировать модули JavaScript, которые соответствуют формату модуля ES6 .

Stats.min.js не поддерживает. Код запутан, но, похоже, создает глобальный и поддерживает старый формат модуля Common JS .