How to fix the ‘What does the error “JSX element type ‘…’ does not have any construct or call signatures”‘ error with TypeScript and React?

Sometimes, we want to fix the ‘What does the error “JSX element type ‘…’ does not have any construct or call signatures”’ error with TypeScript and React.

In this article, we’ll look at how to fix the ‘What does the error “JSX element type ‘…’ does not have any construct or call signatures”’ error with TypeScript and React.

How to fix the ‘What does the error “JSX element type ‘…’ does not have any construct or call signatures”’ error with TypeScript and React?

To fix the ‘What does the error “JSX element type ‘…’ does not have any construct or call signatures”’ error with TypeScript and React, we should use new to instantiate React component classes.

For instance, we shouldn’t write

class Greeter extends React.Component<any, any> {
  render() {
    return <div>Hello, {this.props.name}</div>;
  }
}

//...
const Greet = new Greeter();
<Greet whoToGreet="world" />;

Instead, we write

class Greeter extends React.Component<any, any> {
  render() {
    return <div>Hello, {this.props.name}</div>;
  }
}

//...
<Greet whoToGreet="world" />;

to use the Greet component after we defined it.

How to fix the ‘What does the error “JSX element type ‘…’ does not have any construct or call signatures”’ error with TypeScript and React?

Conclusion