I am not able to emulate the shadows which I did on threejs editor onto threejs code

i am trying to emulate the shadows from a window as shown below which i created in threejs editor

1 - directional light with cast shadows enabled
2 - is the was mesh with cast and receive shadow enabled mesh name : Cube

shadows - Google Drive the drive contains the threejs and the glb file.

the current output of the given file is

Is the shadow map also enabled on the renderer?


  1. Try first setting up the shadows with a PointLight, to make sure your bias / positioning is correct.
  2. Try first setting up with default three.js values, don’t modify shadow map size.
  3. Set receiveShadow and castShadow to true for all children of the scene and see if that fixes the issue. That’d suggest you’re setting these values to wrong objects.

the floor was a child mesh apparently and I had to set receive shadows for it. Thanks a ton!
I removed all the shadow biases and set the individual mesh features!

do you have any idea why artifact might be there