環境：

• vue/cli 4.5.9
• “three”: “^0.124.0”,
• “vue”: “^2.6.11”,
• “vue-router”: “^3.2.0”

搞了一下把three.js融入vue，前面比較順利，在載入檔案時遇到了問題（GLTFLoader）
這些我都有

import * as THREE from "three";
import { OrbitControls } from "three/examples/jsm/controls/OrbitControls";
import { GLTFLoader } from "three/examples/jsm/loaders/GLTFLoader"
 
;

載入模型的程式碼如下：

initLoadGLTF() {
      let loader = new GLTFLoader();
      loader.load(
        "/Models/bonetest/bonetest.gltf",gltf=> {
            console.log(gltf)
          this.scene.add(gltf.scene);
        },
      );
    },

目錄結構如下：

搞了半天，老是報這麼個錯，網上也沒搜到解決方案，而且這個錯誤給的不明確，

SyntaxError:
 
 Unexpected token < in JSON at position 0
    at JSON.parse (<anonymous>)
    at GLTFLoader.parse (GLTFLoader.js?34ad:281)
    at Object.eval [as onLoad] (GLTFLoader.js?34ad:174)
    at XMLHttpRequest.eval (three.module.js?5a89:36749)

我報這個錯的原因是模型檔案路徑錯誤，當然上面給出的程式碼裡是正確的，需要注意的一點就是，你路徑已/開頭，是從public檔案開始，public下的models資料夾下的test.gltf，那麼url就是*”/models/test.gltf“*， 搞了半天，最後測試了一下用axios讀取本地txt，發現路徑不對，txt都讀不出來，感謝