CRA Typescript error when using tw prop on html elements about twin.macro

[rbutera]

In the meantime you can suppress these errors by doing something like this:

instead of

const example = () => (<button type="submit" onClick={handleClick} tw="rounded p-4 bg-red-400">Click Me</button>)

do this

import tw from "twin.macro"

const Button = tw.button`rounded p-4 bg-red-400` // by convention people often use ButtonStyle instead

// below might be React.FunctionComponent ... I forgot

const example: React.ReactElement = ()=> (
 <Button type="submit" onClick={handleClick}> Click Me </Button>
)

or using traditional styled-components syntax:

styled.button`${tw`bg-red-400`}

or

styled('button')`${tw`bg-red-400`}`

... but that is bugged rn and will need to wait for #24

[rbutera]

TypeScript support is pretty fresh. Only in the last alpha release.

Can you please confirm: The prop works as intended, it’s just typescript errors playing up right?

We’ve got a PR in the works to update typescript support: see #24

[reinvanimschoot]

I can confirm it is typescript acting up.

[ben-rogerson]

Typescript errors were fixed in [email protected]
Closing this one up now 👍