I try to create the planet Earth with three.js. I used a texture on a MeshBasicMaterial and it worked perfectly, but when I change the material to a MeshPhongMaterial it just doesn't render the map anymore.

I want to change the material because I want to add a bump Map too.

Here's my code:

let renderer;

const earthGeometry = new THREE.SphereGeometry(5, 50, 50);

const earthMaterial = new THREE.MeshPhongMaterial({
    map: new THREE.TextureLoader().load("../img/globe.jpg"),
  //   bumpMap: new THREE.TextureLoader().load("../img/earthbump.jpg"),
  //   bumpScale: 0.3,
});

const sphere = new THREE.Mesh(earthGeometry, earthMaterial); scene.add(sphere);

And there's not a single problem in the console so I don't know what to do. I'm also using svelte and vite, maybe it can come from here.