【发布时间】：2022-01-09 01:31:15
【问题描述】：
我在这个问题上被难住了好几天。我似乎无法为 Three.js 导入 OBJLoader。这显然很重要，因为我想要在我的游戏中自定义 3D 模型。
我有两条错误消息：
未捕获的类型错误：无法解析模块说明符“three-obj-loader”。相对引用必须以“/”、“./”或“../”开头。
和
加载资源失败：服务器响应状态为 404（未找到）
import {OBJLoader} from 'three-obj-loader'
// load a resource
loader.load(
// resource URL
'/Users/dmitri/Desktop/flame/models/fresh_fire_01 (1).obj',
// called when resource is loaded
function ( object ) {
scene.add( object );
},
// called when loading is in progresses
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);
// const loader = new OBJLoader()
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000)
const renderer = new THREE.WebGLRenderer();
renderer.setClearColor(0xffffff)
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
// loader.load("/Users/dmitri/Desktop/flame/models/fresh_fire_01
(1).obj",
function(object){
// scene.add(object)
// })
var run = function() {
requestAnimationFrame(run);
renderer.render(scene, camera)
}
run()
这是我的 HTML 代码：
<html>
<head>
<style>
body{
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/87/three.min.js">.
</script>
<script src="/script.js" type="module"></script>
</body>
</html>
这是我的 app.js 源代码：
const express = require("express");
var app = express();
app.set("port", process.env.PORT || 8080)
app.use(express.static("public"))
app.listen(app.get("port"), function() {
return
})
这是我的文件结构：
型号
--fresh-fire-01 (1).obj
公开
--index.html
--script.js
app.py
我已经尝试了所有我能想到的解决方案。我将 OBJLoader 的源代码放在我的目录中。我要求它。我什至将 OBJLoader 源代码放在我的 script.js 源代码中。似乎没有任何效果。
【问题讨论】：
-
关注this 并将其他回调添加到
load()方法中。错误回调可能会为您提供更多关于它为什么不起作用的线索 -
它仍然返回两个错误 ------------------------- ------------------------------------------------------- 未捕获的类型错误：无法解析模块说明符“三个 obj-loader”。相对引用必须以“/”、“./”或“../”开头。 -------------------------------------------------- ------------------ 加载资源失败：服务器响应状态为 404（未找到）
-
那里，我刚刚更新了帖子，以便您可以看到我的问题。您提到的问题实际上并不是我正在处理的问题，只需查看文档就可以轻松避免。但我真的不知道我做了什么，我在任何地方的任何文件上都找不到它
-
你在使用 webpack 吗？
-
文档是here。您正在通过 CDN/static 运行 three.js，但如果您使用的是 npm 构建工具，则尝试加载 OBJLoader。
标签： javascript three.js