hi,
I want to add 3d model to threejs but I have encountred “Failed to resolve module specifier” error when trying to import the “three” module in the code. The error message states that relative references must start with either “/”, “./”, or “…/”. why is that?
I think the module specifier “three” is not being resolved correctly so what can I Ido to resolve the problem.
here is the code used :
<script src="three.js"></script>
<script src="stat.js"></script>
<script src="OrbitControls.js"></script>
<script src='Apps.js'></script>
<script type="module">
import * as THREE from './three.js';
import { GLTFLoader } from './GLTFLoader.js';
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 10000 );
const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );
camera.position.z = 5;
var controls = new THREE.OrbitControls( camera, renderer.domElement );
var ambientLight = new THREE.AmbientLight(0xffffff, 0.5);
scene.add(ambientLight);
var directionalLight = new THREE.DirectionalLight(0xffffff, 0.5);
directionalLight.position.set(0.5, 0.5, 0.5);
scene.add(directionalLight);
const loader = new GLTFLoader();
loader.load( 'Soldier.glb', function ( gltf ) {
model = gltf.scene;
scene.add( model );
model.traverse( function ( object ) {
if ( object.isMesh ) object.castShadow = true;
})} );
</script>