三个js阴影不起作用

我正在尝试设置我写这一行的阴影：

renderer.shadowMap.enabled = true;

什么都没有出现，之后编译器会写一个错误：

TypeError: Cannot set property 'enabled' of undefined

完整代码：

var camera, controls, scene, renderer;
var plane
var shoulder, cubit, wrist;
var root_beam, top_beam;
var claw_base, claw_one, claw_two;

function init() {

    // create a scene, that will hold all our elements such as objects, cameras and lights.
    scene = new THREE.Scene();

    // create a camera, which defines where we're looking at.
    camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 1000);

    // create a render and set the size
    renderer = new THREE.WebGLRenderer();
    renderer.setClearColorHex();
    renderer.setClearColor(new THREE.Color(0x000000));
    renderer.setSize(window.innerWidth-350, window.innerHeight-65);

    // show axes in the screen
    var axes = new THREE.AxisHelper(20);
    scene.add(axes);

    // create the ground plane
    var planeGeometry = new THREE.PlaneGeometry(60, 60);
    var planeMaterial = new THREE.MeshBasicMaterial({color: 0xffffff});
    plane = new THREE.Mesh(planeGeometry, planeMaterial);

    // rotate and position the plane
    plane.rotation.x = -0.5 * Math.PI;
    plane.position.x = 0;
    plane.position.y = 0;
    plane.position.z = 0;

    // add the plane to the scene
    scene.add(plane);

    var sphereGeometry = new THREE.SphereGeometry(2, 20, 20);
    var sphereMaterial = new THREE.MeshBasicMaterial({color: 0x8B0000, wireframe: false});

    shoulder = new THREE.Mesh(sphereGeometry, sphereMaterial);
    shoulder.position.z = 2;


    plane.add(shoulder);

    var geometry = new THREE.CylinderGeometry( 1.5, 1.5, 20, 32 );
    var material = new THREE.MeshBasicMaterial( {color: 0x778899} );
    root_beam = new THREE.Mesh( geometry, material );
    root_beam.rotation.x = 0.5 * Math.PI;
    root_beam.position.z = 10;

    shoulder.add(root_beam);

    cubit = new THREE.Mesh(sphereGeometry, sphereMaterial);
    cubit.position.y = 10;

    root_beam.add(cubit);

    top_beam = new THREE.Mesh( geometry, material );
    top_beam.position.y = 10;
    cubit.add(top_beam);

    wrist = new THREE.Mesh(sphereGeometry, sphereMaterial);
    wrist.position.y = 10;

    top_beam.add(wrist);

    var cubeGeometry = new THREE.BoxGeometry(12, 1, 4);
    var cubeMaterial = new THREE.MeshBasicMaterial({color: 0x778899, wireframe: false});
    claw_base = new THREE.Mesh(cubeGeometry, cubeMaterial);
    claw_base.position.y = 2;

    wrist.add(claw_base);

    cubeGeometry = new THREE.BoxGeometry(6, 1, 4);
    cubeMaterial = new THREE.MeshBasicMaterial({color: 0xFF0000, wireframe: false});

    claw_one = new THREE.Mesh(cubeGeometry, cubeMaterial);
    claw_one.rotation.z = 0.5 * Math.PI;
    claw_one.position.y = 3.5;
    claw_one.position.x = 5.5;

    claw_base.add(claw_one);

    cubeMaterial = new THREE.MeshBasicMaterial({color: 0x0000FF, wireframe: false});

    claw_two = new THREE.Mesh(cubeGeometry, cubeMaterial);
    claw_two.rotation.z = 0.5 * Math.PI;
    claw_two.position.y = 3.5;
    claw_two.position.x = -5.5;

    claw_base.add(claw_two);

    shoulder.rotation.y = 0.5;

    cubit.rotation.z = 1.5;

    wrist.rotation.y = 0.8;

    // position and point the camera to the center of the scene
    camera.position.x = -30;
    camera.position.y = 40;
    camera.position.z = 30;
    camera.lookAt(scene.position);

    // add the output of the renderer to the html element
    document.getElementById("imterBody").appendChild(renderer.domElement);

    controls = new THREE.OrbitControls( camera, renderer.domElement );
                //controls.addEventListener( 'change', render ); // call this only in static scenes (i.e., if there is no animation loop)
    controls.enableDamping = true; // an animation loop is required when either damping or auto-rotation are enabled
    controls.dampingFactor = 0.25;
    controls.screenSpacePanning = false;
    controls.minDistance = 100;
    controls.maxDistance = 500;
    controls.maxPolarAngle = Math.PI / 2;


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

function onWindowResize() {
    camera.aspect = window.innerWidth / window.innerHeight;
    camera.updateProjectionMatrix();
    //renderer.setSize( window.innerWidth, window.innerHeight );
    renderer.setSize( window.innerWidth, window.innerHeight );
}

function animate() {
    requestAnimationFrame( animate );
    controls.update();
    render();
}

function render() {
    renderer.render( scene, camera );
}

function start(){
    init();
    animate();
}
window.onload = start;