相关模块说明符必须以“./”、“../”或“/”开头

Question

我正在尝试导入 three.js。我正在按照文档进行操作，但是出现错误：

Uncaught TypeError: Error resolving module specifier “three”. Relative module specifiers must start with “./”, “../” or “/”

我的导入语句：

<script async src="https://unpkg.com/es-module-shims@1.3.6/dist/es-module-shims.js"></script>
<script type="importmap">
  {
    "imports": {
      "three": "https://unpkg.com/three@0.139.2/build/three.module.js"
    }
  }
</script>

<script type="module">

  import * as THREE from 'three';
  const scene = new THREE.Scene();

</script>

我是不是导入错了？我应该把“./”、“../”或“/”放在哪里？

Answer 1

我觉得您使用导入地图使事情过于复杂，并且引入了 very poor browser support 的风险，正如 TheJim01 提出的那样。

只需将 three.module.js 文件从 https://unpkg.com/three@0.139.2/build/three.module.js 复制到您应用中的本地文件夹，例如 /libraries/three.module.js。

然后用

导入

<script type="module">

  import * as THREE from './libraries/three.module.js';
  const scene = new THREE.Scene();

</script>

相关模块说明符必须以“./”、“../”或“/”开头

Relative module specifiers must start with “./”, “../” or “/”

html

javascript

three.js