尝试导入时收到 Javascript 错误"Uncaught SyntaxError: cannot use import statement outside a module"。找到解决方案

深入细节，我试图从一个名为GLTFLoader的JS文件中导入代码。目标是解析一个. glb文件并呈现一个Teapot。

HTML:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>
        Three.js #1
    </title>
    <style>
        body{margin: 0;}
    </style>
</head>
<body>
    <script src="js/three.js"></script> // A dependecy.
    <script src="js/cube.js"></script> // The main script.
    <script src="js/loaders/GLTFLoader.mjs"></script> // The module I am trying to import code
</body>                                               // from.
</html>

导入代码和需要导入的代码。可以上传完整的代码，如果需要。

import {GTLFLoader} from "js/loaders/GLTFLoader.mjs"
// Create a mesh.
const loader = new GLTFLoader(); // Instantiate loader.
loader.load("assets/models/utahteapot.glb", function (gltf) { // Load the model.
scene.add(gltf.scene); // Add the loaded model to scene.
}, undefined, function (error) { // Return an error if there is one.
console.error(error);
});

我试过使用"type="模块"标记内的脚本标记，我已经尝试直接从url源上传Loader代码，我已经尝试导入HTML文件中的代码，我甚至尝试创建一个本地服务器来托管这些文件。我以前不这么做，现在还是这样。我已经没有主意了;我找不到解决办法。编辑:忘了提，文件GLTFLoader扩展名是。mjs，因为我在这个错误中遇到了一个不相关的错误。

我找到了一个解决方案。这不是我如何输入或索引文件的问题，而是我如何在本地服务器上提供它们的问题。

MIME错误是由于文件总是返回不正确的MIME类型"plain/text"当我需要它返回为"application/x-javascript"导入错误是由于我没有添加type="module">

所以，我寻找了一个python脚本，它创建了一个LocalHost服务器，可以正确地为文件提供服务。因此，这意味着我可以将main.js文件标记为模块，并从其他文件中导入所需的内容。

这是脚本的git。

注意:您可能需要更改您的本地主机编号。设置的号码是8080，在我的文件真正更新之前，我不得不将我的号码更改为8090。如果您的文件没有更新或返回错误，请记住这一点。

相关内容

最新更新

热门标签：