title: In Typescript, why is JSX.IntrinsicElements not working as documentation describes?
body: <p>I'm trying to use JSX on the server side, without React. I'm following the typescript docs about JSX <a href="https://www.typescriptlang.org/docs/handbook/jsx.html#intrinsic-elements" rel="nofollow noreferrer">here</a>, and wrote the following in a <code>.tsx</code> file.</p>
  
  <pre><code>declare namespace JSX {
    interface IntrinsicElements {
      foo: any
    }
  }
  let elt1 = &lt;foo/&gt;
  let elt2 = &lt;bar/&gt;
  </code></pre>
  
  <p>The linked docs say:</p>
  
  <blockquote>
    <p>In the above example, <code>&lt;foo/&gt;</code> will work fine but <code>&lt;bar/&gt;</code> will result in an error ...</p>
  </blockquote>
  
  <p>But for me, they both result in the same error:</p>
  
  <blockquote>
    <p>Property 'foo' does not exist on type 'JSX.IntrinsicElements'.<br>
    Property 'bar' does not exist on type 'JSX.IntrinsicElements'.</p>
  </blockquote>