title: Typescript component runs correctly but says there is an error because it does not recognize a property that is there
body: <p>I am using three.js library for drawing an image to the screen. When I create my particles = THREE.point(geometry, materials) typescript says that vertices does not exist in particles.geometry.vertices, but when I run my module everything loads and responds as it should besides it gives me this error saying vertices does not exists, and if they did not exist I would not have drawn that image.</p>
  
  <p>Geometry has a property that is called vertices, and when I create the object particles through three.point(geometry, material); I get all the vertices from geometry and access them by doing this.particles.geometry.vertices, but typescript says the property does not exist in geometry even though it works.</p>
  
  <p>Picture of error even though everything is executing as it should:
  <a href="https://i.stack.imgur.com/Ea0xi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Ea0xi.png" alt="enter image description here"></a>
  Errors in text:</p>
  
  <pre><code>[at-loader] ./ClientApp/app/components/shared/backgroundScene/backgroundScene.component.ts:146:53 
      TS2339: Property 'vertices' does not exist on type 'Geometry | BufferGeometry'.
    Property 'vertices' does not exist on type 'BufferGeometry'.
  [at-loader] ./ClientApp/app/components/shared/backgroundScene/backgroundScene.component.ts:147:56 
      TS2339: Property 'vertices' does not exist on type 'Geometry | BufferGeometry'.
    Property 'vertices' does not exist on type 'BufferGeometry'.
  [at-loader] ./ClientApp/app/components/shared/backgroundScene/backgroundScene.component.ts:152:33 
      TS2339: Property 'verticesNeedUpdate' does not exist on type 'Geometry | BufferGeometry'.
    Property 'verticesNeedUpdate' does not exist on type 'BufferGeometry'.
  </code></pre>
  
  <p>Source code for drawing image where it says vertices does not exist is in the render, and the drawImage just shows how I add to my particles. Everything works fine, I just do not get why I am getting these errors when everything is working correctly. If you know how to get the typings so I can see these properties in my object let me know. I have threejs imported and the typings if you were wondering and those work fine. I just come across problems accessing properties of objects when the property exists and typescript says it does not but when I run my code I can see that it does.</p>
  
  <pre><code>public render() {
      this.renderer.render(this.scene, this.camera);
  
      // Draw image to screen
      for (var i = 0, j = this.particles.geometry.vertices.length; i &lt; j; i++) {
          var particle:any = this.particles.geometry.vertices[i];
          particle.x += (particle.destination.x - particle.x) * particle.speed;
          particle.y += (particle.destination.y - particle.y) * particle.speed;
          particle.z += (particle.destination.z - particle.z) * particle.speed;
      }
      this.particles.geometry.verticesNeedUpdate = true;
  }
  
  public drawImage() {
  
      // Create vertices to draw the image.
      for (var y = 0, y2 = this.imageData.height; y &lt; y2; y += 2) {
          for (var x = 0, x2 = this.imageData.width; x &lt; x2; x += 2) {
              if (this.imageData.data[(x * 4 + y * 4 * this.imageData.width) + 3] &gt; 128) {
  
                  let vertex:any = new THREE.Vector3();
                  vertex.x = Math.random() * 1000 - 500;
                  vertex.y = Math.random() * 1000 - 500;
                  vertex.z = -Math.random() * 500;
  
                  vertex.destination = {
                      x: x - this.imageData.width / 2,
                      y: -y + this.imageData.height / 2,
                      z: 0
                  };
  
                  vertex.speed = Math.random() / 200 + 0.015;
  
                  this.geometry.vertices.push(vertex);
              }
          }
      }
      this.particles = new THREE.Points(this.geometry, this.material);
      this.scene.add(this.particles);
  
      requestAnimationFrame(this.render);
  }
  </code></pre>