Ошибка импорта трех. js через npm и просмотра - PullRequest
Новая
       35

Ошибка импорта трех. js через npm и просмотра

1 голос
/ 07 марта 2020

Я очень новичок в npms и пытаюсь импортировать три. js в мою сцену, но она появляется с этой ошибкой, несмотря на указание type = "module" в моем теге скрипта в моем html enter image description here Я установил его через npm и вот мой javascript: 

var $ = require('jquery');

var three = require('three');

import * as THREE from 'three';
 import OrbitControls from 'three/examples/jsm/controls/OrbitControls';

var camera, scene, renderer;
var geometry, material, mesh;

init();
animate();

function init() {

    camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.01, 10 );
    camera.position.z = 1;

    scene = new THREE.Scene();

    geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
    material = new THREE.MeshNormalMaterial();

    mesh = new THREE.Mesh( geometry, material );
    scene.add( mesh );

    renderer = new THREE.WebGLRenderer( { antialias: true } );
    renderer.setSize( window.innerWidth, window.innerHeight );
    document.body.appendChild( renderer.domElement );

}

function animate() {

    requestAnimationFrame( animate );

    mesh.rotation.x += 0.01;
    mesh.rotation.y += 0.02;

    renderer.render( scene, camera );

}

Вот мой html: 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="shortcut icon" href="#"/>
    <title>Document</title>
    <script type = "module" src="/bundle.js"></script>
</head>
<body>

</body>
</html>

Извините, если ответ очевиден, использование browserify и файлов модулей - это для меня очень новая территория.

Редактировать: в официальной документации сказано: 

var THREE = require('three');

var scene = new THREE.Scene();
...

, которая работает, кроме I хотите использовать 

import { MapControls } from 'three/examples/jsm/controls/OrbitControls.js';

, который доступен только путем извлечения его из библиотеки orbitcontrols. Есть ли способ сделать это без импорта ES6 и использовать вместо него require()?

...