Custom elements not compatible with React + Typescript

Description:

When using Typescript with React, custom elements cause typescript errors such as Property 'a-scene' does not exist on type 'JSX.IntrinsicElements'. Installing @types/aframe does not address the issue. The errors go away when one manually defines the IntrinsicElements using the technique outlined in https://github.com/Microsoft/TypeScript/issues/15449#issuecomment-385959396. This is a tedious process as all tags and attributes for each element used must be defined. Another way to address this is to isolate the elements into a separate file where typescript checking is disabled, also not optimal.

  "devDependencies": {
    "@types/aframe": "^1.0.3",
  },
  "dependencies": {
    "aframe": "^1.2.0",
  },

The DefinitelyTyped entry for @types/aframe links here but should this be logged on the DefinitelyTyped repo instead? I consider this a big DX factor for aframe so I’m posting here first.

[rajsite]

I think there are potentially more issue than just types when using React with web components. The library @lit-labs/react could potentially be used to wrap web components as React components but I haven’t tried it with aframe.

[jotatoledo]

Seems like somebody already started an effort to create the corresponding jsx types. See here