GET http://127.0.0.1:3000/build/three.module.js net :: ERR_ABORTED 404 (не найдено) Ошибка при попытке использовать элементы управления орбитой с three.js

Я пытаюсь создать Sky Box с помощью three.js, создал куб и применил текстуры, однако теперь мне нужно импортировать элементы управления камерой. Сначала я создал файл OrbitControls.js (с правильным кодом внутри), но когда я пытаюсь использовать let controls = new OrbitControls( camera, renderer.domElement ); для добавления элементов управления, я получаю сообщение об ошибке GET https://127.0.0.1:3000/build/three.module.js net::ERR_ABORTED 404 (Not Found) при попытке использовать элементы управления орбитой с three.js. Я добавил файл three.module.js и нашел для него код. добавил его в свой HTML-код с помощью <script type="module" src="three.module.js"></script>, но я все еще получаю вышеупомянутую ошибку.

Вот мой JS и теги скриптов, которые получают three.js:

<body>
        <script src="three.js"></script>
    <script type="module" src="three.module.js"></script>
        <script type="module">
    import { OrbitControls } from "./OrbitControls.js"
    const scene = new THREE.Scene();
    const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
    const renderer = new THREE.WebGLRenderer();

    renderer.setSize( window.innerWidth, window.innerHeight );
    document.body.appendChild( renderer.domElement );
    const geometry = new THREE.BoxGeometry();
    const material = []
      let texture_ft = new THREE.TextureLoader().load("cocoa_ft.jpg");
      let texture_bk = new THREE.TextureLoader().load("cocoa_bk.jpg");
      let texture_up = new THREE.TextureLoader().load("cocoa_up.jpg");
      let texture_dn = new THREE.TextureLoader().load("cocoa_dn.jpg");
      let texture_rt = new THREE.TextureLoader().load("cocoa_rt.jpg");
      let texture_lf = new THREE.TextureLoader().load("cocoa_lf.jpg");

      material.push(new THREE.MeshBasicMaterial( { map: texture_ft }));
      material.push(new THREE.MeshBasicMaterial( { map: texture_bk }));
      material.push(new THREE.MeshBasicMaterial( { map: texture_up }));
      material.push(new THREE.MeshBasicMaterial( { map: texture_dn }));
      material.push(new THREE.MeshBasicMaterial( { map: texture_rt }));
      material.push(new THREE.MeshBasicMaterial( { map: texture_lf }));
    const cube = new THREE.Mesh( geometry, material );
    scene.add( cube );

    camera.position.z = 5;
    function animate() {
      requestAnimationFrame( animate );
      renderer.render( scene, camera );
}
  animate();

    let controls = new OrbitControls( camera, renderer.domElement );
        </script>
    </body>

вышеупомянутая ошибка означает, что на вашем сервере нет такого файла.   —  person Reuben    schedule 22.03.2021

См. также:  С праздником от Jscrambler — специальный подарок для вас
Понравилась статья? Поделиться с друзьями:
IT Шеф
Комментарии: 1
  1. Reuben

    Скорее всего, это проблема с каталогом файлов. Когда вы используете src="three.module.js" в своем HTML-файле, вы сообщаете браузеру, что ваши .html и three.module.js файлы находятся в одной папке. Вероятно, вам придется изменить src, чтобы он фактически указывал на расположение файла JavaSript:

    • src="../three.module.js" это поднимается на одну папку вверх
    • src="./subfolder/three.module.js" это входит в подпапку

    Просто посмотрите на структуру папок и попытайтесь указать правильное место. То же самое и с OrbitControls.

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: