Shadow on itself GLTF model

[tizkon]

I already have this settings added on this code:

import * as THREE from 'https://threejs.org/build/three.module.js';

import { GLTFLoader } from 'https://threejs.org/examples/jsm/loaders/GLTFLoader.js';
import {GUI} from 'https://threejsfundamentals.org/threejs/../3rdparty/dat.gui.module.js';
import { RGBELoader } from '../loaders/RGBELoader.js';
import { RoughnessMipmapper } from '../loaders/RoughnessMipmapper.js';
import { EffectComposer } from 'https://threejs.org/examples/jsm/postprocessing/EffectComposer.js';
import { RenderPass } from 'https://threejs.org/examples/jsm/postprocessing/RenderPass.js';


let camera, scene, renderer, clock, mixer, composer, controls;

init();
render();

function init() {
  clock = new THREE.Clock();

  const canvas = document.querySelector('#c');

  camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.25, 20 );
  camera.position.set( -0.05, 0.37, 0.29 );
  camera.lookAt(new THREE.Vector3(-0.05,-0.12,-0.15));


  scene = new THREE.Scene();

 // scene.fog = new THREE.Fog( 0xffffff, 0.1, 2.55 );



  var ambientLight = new THREE.AmbientLight( 0xffffff, 0.15 );
  scene.add( ambientLight );

  var spotLight = new THREE.SpotLight( 0xffffff, 0.2 );
  spotLight.position.set( -10, 7, 6.6 );
  spotLight.angle = 0.4;
  spotLight.penumbra = 0.05;
  spotLight.decay = 1;
  spotLight.distance = 2000;

  spotLight.castShadow = true;
  spotLight.shadow.mapSize.width = 2024;
  spotLight.shadow.mapSize.height = 2024;
  spotLight.shadow.camera.near = 0.01;
  spotLight.shadow.camera.far = 1;

  scene.add( spotLight );

  spotLight.target.position.set( 3, 0, - 3 );
  scene.add( spotLight.target );


  new RGBELoader()
    .setDataType( THREE.UnsignedByteType )
    .setPath( '/assets/threeJS/map/gltf/' )
    .load( 'GCanyon_C_YumaPoint_3k.hdr', function ( texture ) {

      const envMap = pmremGenerator.fromEquirectangular( texture ).texture;

      scene.background = envMap;
      scene.environment = envMap;

      texture.dispose();
      pmremGenerator.dispose();

      render();

      const roughnessMipmapper = new RoughnessMipmapper( renderer );

      const loader = new GLTFLoader();
      loader.load( 'assets/threeJS/map/gltf/scene.gltf', function ( gltf ) {

       mixer = new THREE.AnimationMixer( gltf.scene );

        let model = gltf.scene;

        model.traverse( function ( child ) {

          if ( child.isMesh ) {

            child.material.shading = THREE.SmoothShading;
            child.castShadow = true;
            child.receiveShadow = true;

          }

        });

        scene.add(model);

        mixer = new THREE.AnimationMixer( gltf.scene );

        gltf.animations.forEach( ( clip ) => {

          mixer.clipAction( clip ).play();

        } );

        scene.add( gltf.scene );

        roughnessMipmapper.dispose();

        render();

      } );

    } );

  renderer = new THREE.WebGLRenderer( {canvas, antialias: true } );
  renderer.gammaOutput = true;
  renderer.gammaFactor = 2.2;
  renderer.shadowMap = THREE.VSMShadowMap;

  const renderScene = new RenderPass( scene, camera );

  composer = new EffectComposer( renderer );
  composer.addPass( renderScene );



  renderer.setPixelRatio( window.devicePixelRatio );
  renderer.setSize( window.innerWidth, window.innerHeight );

  renderer.toneMapping = THREE.ACESFilmicToneMapping;
  renderer.toneMappingExposure = 1;
  renderer.outputEncoding = THREE.sRGBEncoding;

  const pmremGenerator = new THREE.PMREMGenerator( renderer );
  pmremGenerator.compileEquirectangularShader();

  const gui = new GUI();

  gui.add(camera.position, 'x', -5,5).step(0.001).onChange( function( value ){ camera.position.z = value; } );
  gui.add(camera.position, 'y', -5,5).step(0.001).onChange( function( value ){ camera.position.z = value; } );
  gui.add(camera.position, 'z', 1,5).step(0.001).onChange( function( value ){ camera.position.z = value; } );


  window.addEventListener( 'resize', onWindowResize, false );

}

function onWindowResize() {

  camera.aspect = window.innerWidth / window.innerHeight;
  camera.updateProjectionMatrix();

  renderer.setSize( window.innerWidth, window.innerHeight );

  render();

}

function render() {

  var delta = clock.getDelta();
  controls.update();
  if ( mixer ) mixer.update( delta );

  renderer.render( scene, camera );

  requestAnimationFrame( render );


  composer.render();
}

And I am unable to see any shadows

Gyazo

Here you can see the it closer:

Gyazo