截至 137 无法解析模块说明符 "three"

Question

回到一些旧项目，我发现没有加载任何内容。检查控制台日志我看到以下内容：

Uncaught TypeError: Failed to resolve module specifier "three". Relative references must start with either "/", "./", or "../".

在我的脚本中我得到了以下内容：

<script type="module">
import * as THREE from "https://cdn.skypack.dev/three/build/three.module.js"
import { OBJLoader } from "https://cdn.skypack.dev/three/examples/jsm/loaders/OBJLoader.js"
import { FirstPersonControls } from "https://cdn.skypack.dev/three/examples/jsm/controls/FirstPersonControls.js"

我尝试后退一些版本，直到我达到 0.136.0 时，此错误才会消失。导入方式 three.js 是否已更改，或者这是一个错误？

此外，是否有某种方法可以在运行时捕获它？就像我从 Skypack 获取最新版本号并尝试导入一样。如果失败，自动后退一位小数并重试。

编辑
@Mugen87 提供使用 importmap。我用以下内容更改我的代码：

<script type="importmap">
{
    "imports": {
        "three": "https://cdn.skypack.dev/three/build/three.module.js",
        "three/OBJLoader": "https://cdn.skypack.dev/three/examples/jsm/loaders/OBJLoader.js",
        "three/FirstPersonControls": "https://cdn.skypack.dev/three/examples/jsm/controls/FirstPersonControls.js"
    }
}
</script>

<script type="module">
import * as THREE from "three"
import { OBJLoader } from "three/OBJLoader"
import { FirstPersonControls } from "three/FirstPersonControls"

我收到以下错误：

Uncaught SyntaxError: The requested module '/-/three@v0.137.5-HJEdoVYPhjkiJWkt6XIa/dist=es2019,mode=raw/build/three.module.js' does not provide an export named 'default'

Answer 1

您正在使用的 CDN (cdn.skypack.dev) 在他们这边做了一些 re-exporting，这是导致问题的原因。

您在导入中引用的文件实际上不是 three.js 模块，而是 re-direct.

该文件执行 export *（没问题）和 export {default}，这是发生故障的地方。 Three.js 没有 default 导出。

Skypack 很可能将此重定向普遍应用于所有模块，因此他们不一定知道这种情况正在发生，但他们绝对应该在托管特定模块之前测试他们的系统...

尝试将您的 importmap 更改为引用以下内容 URL，它应该会起作用：

https://cdn.skypack.dev/-/three@v0.137.5-HJEdoVYPhjkiJWkt6XIa/dist=es2019,mode=raw/build/three.module.js

截至 137 无法解析模块说明符 "three"

Failed to resolve module specifier "three" as of 137

javascript

three.js

skypack-cdn