javascript - Vue JS，GLTF 加载器错误 "currently no loaders are configured"

Question

我正在尝试将 gltf 加载到 vue 项目中。这是我的代码

import * as THREE from 'three'
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';

let scene,camera,renderer;

function init(){

    scene = new THREE.Scene();
    scene.background = new THREE.Color(0xdddddd);

    camera = new THREE.PerspectiveCamera(40,window.innerWidth/window.innerHeight,1,5000);


    renderer = new THREE.WebGLRenderer();
    renderer.setSize(window.innerWidth,window.innerHeight);
    document.body.appendChild(renderer.domElement);


    let loader = new GLTFLoader();

    loader.load(require('../../assets/tshirt/gitF/tshirt.glb'),function(gltf){
        //some code here 
}

init();

我不断收到错误

./src/assets/tshirt/gitF/tshirt.glb 1:4
Module parse failed: Unexpected character '' (1:4)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
(Source code omitted for this binary file)

我在这里做错了什么？ PS:我对 VUE 和 Three.js 都很陌生。我已经在没有框架的情况下尝试过这个确切的代码并且它有效。仅当代码在 VUE 中运行时才会出现该错误。

Answer 1

您在加载调用中不需要 require()，并且您的函数括号未正确关闭:

init() {
    //...
    loader.load('../../assets/tshirt/gitF/tshirt.glb',function(gltf){
            //some code here 
    }
}