You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm having trouble using this component in a Gatsby Typescript product.
The web-component is not recognized as a valid JSX element. Do you have any guidance on how we may overcome this issue?
I see that the source code is written in typescript, with a global declaration at the bottom. But perhaps this isn't being picked up by my Typescript settings?
Here is the specific error: Property 'lite-youtube' does not exist on type 'JSX.IntrinsicElements'.
The text was updated successfully, but these errors were encountered:
I was able to get a build working using the following, but it's quite messy:
import'@justinribeiro/lite-youtube';import{LiteYTEmbed}from'@justinribeiro/lite-youtube';typeCustomElement<T>=Partial<T&DOMAttributes<T>&{children: any}>;declareglobal{namespaceJSX{interfaceIntrinsicElements{['lite-youtube']: CustomElement<LiteYTEmbed>;}}}// Then within the jsx:<lite-youtubevideoId="guJLfqTFfIw"autoLoad/>;
@justinribeiro note: I actually had to remove the import '@justinribeiro/lite-youtube'; line to get this to compile. Otherwise building throws an error ReferenceError: HTMLElement is not defined.
I'm using Gatsby, and originally moved this import line to the gatsby-browser.js and gatsby-ssr.js files with no problem (at the time these files were empty, the import statement was the only content).
However now that I have added other content to these files, once again that import statement throws that error on build. I'm forced to use the CDN script tag.
I'm having trouble using this component in a Gatsby Typescript product.
The web-component is not recognized as a valid JSX element. Do you have any guidance on how we may overcome this issue?
I see that the source code is written in typescript, with a global declaration at the bottom. But perhaps this isn't being picked up by my Typescript settings?
Here is the specific error:
Property 'lite-youtube' does not exist on type 'JSX.IntrinsicElements'.
The text was updated successfully, but these errors were encountered: