JSX element type does not have any construct or call signatures

Question

I'm using this simple React element on the left as my root element on the page in the right.

How do I fix the error shown?

Your code looks correct to me; which version of Typescript are you using? It seems it's 1.8 that provided more support with React stateless function components. — Johnny Magrippis
– Johnny Magrippis, Commented Jun 7, 2016 at 10:00
I have the same problem. Doesn't seem to support stateless components. ts 1.8.10. — ieugen
– ieugen, Commented Aug 22, 2016 at 20:37
Do you still get the message when you default export the App directly, without the cssModules HOC? Do you still have the problem when changing the filename of app.tsx, and you do not get an error message about thhe unresolveable require? — Fabian S
– Fabian S, Commented Jan 29, 2019 at 14:09

mawburn · Accepted Answer · 2018-10-11 20:29:03Z

2

This hacky typecast makes the error go away, though I don't understand it at all:

const App: any = require('./components/views/app/app');

edited Oct 11, 2018 at 20:29

mawburn

2,3554 gold badges31 silver badges48 bronze badges

answered Jun 7, 2016 at 12:56

Richard

17.1k25 gold badges79 silver badges110 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Connor Finn McKelvey Over a year ago

Here you are casting App as an Any type and bypassing the type system. The Typescript errors went away because now you are effectively just using Javascript.

vorillaz · Accepted Answer · 2016-06-07 10:24:16Z

1

How about:

class App extends React.Component<any, any> {
    render() {
        return <div>foo</div>;
    }
}

answered Jun 7, 2016 at 10:24

vorillaz

6,3062 gold badges32 silver badges46 bronze badges

1 Comment

Richard Over a year ago

Thanks, but I don't see how that helps. The app.ts file is returning cssModules(App, css), not the function App in the app.ts file.

Michael Frost Billing · Accepted Answer · 2017-01-05 20:23:13Z

0

React expects a React.StatelessComponent from the imported App in mainScreenHelper.tsx This means that you need to provide that interface in App

interface IProps {}
const App : React.StatelessComponent<IProps> = () => (
   <div></div>
);

answered Jan 5, 2017 at 20:23

Michael Frost Billing

5585 silver badges12 bronze badges

Collectives™ on Stack Overflow

JSX element type does not have any construct or call signatures

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related