title: Using lights in three.js shader
body: <p>I'm trying to access the scene's lights from a shader in three.js.</p>
  
  <p>This question is nearly a duplicate of <a href="https://stackoverflow.com/questions/16508280/three-js-shadermaterial-issue-with-lights">Three.js ShaderMaterial issue with lights</a>
  but the comments on that question aren't helping me resolve the issue.</p>
  
  <p>Here is the vertex shader:</p>
  
  <pre><code>#if NUM_DIR_LIGHTS &gt; 0
      struct DirectionalLight {
          vec3 direction;
          vec3 color;
          int shadow;
          float shadowBias;
          float shadowRadius;
          vec2 shadowMapSize;
       };
       uniform DirectionalLight directionalLights[ NUM_DIR_LIGHTS ];
  #endif
    varying vec3 color;
    void main() {
       float r = directionalLights[0].color.r;
       color = vec3(r,1.0,0.0);
       gl_Position = projectionMatrix * modelViewMatrix * vec4(position , 1.0);
    }
  </code></pre>
  
  <p>and the relevant ShaderMaterial:</p>
  
  <pre><code>var material = new THREE.ShaderMaterial({
      uniforms: THREE.UniformsLib['lights'],
      vertexShader: document.getElementById('vertexShader').innerHTML,
      fragmentShader: document.getElementById('fragmentShader').innerHTML,
      lights : true
    });
  </code></pre>
  
  <p>I've posted the entire example code here: <a href="https://jsfiddle.net/zhkvcajs/" rel="noreferrer">https://jsfiddle.net/zhkvcajs/</a></p>
  
  <p>Removing the <code>lights : true</code> renders a green knot, but it's not getting the <code>directionalLights</code> information that should change the knot's color.  Apparently, <code>lights : true</code> is required for that, but causes an error.</p>