[TS] StyledComponentClass does not have any construct or call signatures

Hello. I’m trying to up a new project with typescript + styled-components, but I faced with a problem with prop types + jsx. I get this error: [ts] JSX element type 'Styled' does not have any construct or call signatures when I try to use a Component from styled.

type Props = {
  color: string,
};

const Styled = styled<Props>('div')`
  color: ${p => p.color};
`;

// later
render() {
  return (
    <Styled />  {/* [ts] JSX element type 'Styled' does not have any construct or call signatures */}
  ) ;
}

Styled type is StyledComponentClass<Props, any, Props> by inference as specified in styled typings.

But if I force the type as any it works ‘normally’, without error:

const Styled: any = styled<Props>('div')`
  color: ${p => p.color};
`;

But this way I’ll loss all the typing benefit, I think.

I tried put StatelessComponent<Props> instead of any, but unsuccessfully (I don’t know why, I’m new with TS)

---

How can I get around this situation?

[renatorib]

Sorry, my bad. I forgot to install @types/react;

[tur-nr]

After much playing about I noticed that you have to enable Typescript support on VSCode. I had a fresh install of VSCode and after installing/enabling full support the Typingscript it worked.

Just click Typescript on the welcome screen and reload your editor. It’s funny cause Typescript syntax works out the box for VSCode, but only after I do this does it begin to work 🤔

Thanks again team.

❤️💅