Why are threejs shadows not showing?

Question

JavaScript

I don't understand why the shadows are not displayed, I've already looked through everything
let canvas = document.getElementById("canvas");
let width = window.innerWidth;
let height = window.innerHeight;
canvas.width = width;
canvas.height = height;

let renderer = new THREE.WebGLRenderer({
canvas: canvas,
antialias: true
});

var scene, camera, mesh;
var meshFloor, ambientLight, light;

function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(90, width / height, 0.1, 1000);

mesh = new THREE.Mesh(
new THREE.BoxGeometry(100, 100, 100),
new THREE.MeshLambertMaterial({
color: 0xff4444
})
);
mesh.position.y = 100;
mesh.receiveShadow = true;
mesh.castShadow = true;
scene.add(mesh);

meshFloor = new THREE.Mesh(
new THREE.PlaneGeometry(700, 700, 700, 10),
new THREE.MeshLambertMaterial({
color: 0xffffff
})
);
meshFloor.rotation.x -= Math.PI / 2;
meshFloor.receiveShadow = true;
scene.add(meshFloor);

let light = new THREE.PointLight(0xffffff, 0.8, 1800);
light.position.set(0,500, 00);
light.castShadow = true;

light.shadow.camera.near = 1000;
light.shadow.camera.far = 25000;
scene.add(light);

camera.position.set(0, 100, 400);

renderer.setSize(1280, 720);

// Enable Shadows in the Renderer
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.BasicShadowMap;

animate();
}

function animate() {
requestAnimationFrame(animate);

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

renderer.render(scene, camera);
}

window.onload = init;

Answer 1

light.shadow.camera.near = 100;