'ErrorBoundary' cannot be used as a JSX component
See original GitHub issueHi guys, I get a strange typescript error when I use the default first example from your lib:
‘ErrorBoundary’ cannot be used as a JSX component, any chance you had seen that before?
![Screenshot 2022-04-15 at 15 41 08](https://user-images.githubusercontent.com/8066536/163584676-5d70f0ad-7385-416a-8cbe-043af6aead7c.png)
react-error-boundary
version: 3.1.4node
version: 14.19.0npm
version: 6.14.16
` import {ErrorBoundary} from ‘react-error-boundary’ function ErrorFallback({error, resetErrorBoundary}) { return ( <div role="alert">
Something went wrong:
{error.message}<button onClick={resetErrorBoundary}>Try again</button> </div> ) } const ui = ( <ErrorBoundary FallbackComponent={ErrorFallback} onReset={() => { // reset the state of your app so the error doesn’t happen again }}
<ComponentThatMayError />
</ErrorBoundary>
)
`
Issue Analytics
- State:
- Created a year ago
- Reactions:16
- Comments:19
Top Results From Across the Web
'ErrorBoundary' cannot be used as a JSX component error ...
I have a problem with react-error-boundary error when migrating from CRA to vite.js (2.9.12). react-error-boundary version: 3.1.4 node ...
Read more >Component cannot be used as a JSX component. Its return ...
I'm currently getting the following error on the Todos component inside TodoApp.tsx : 'Todos' cannot be used as a JSX component.
Read more >Error Boundaries - React
A class component becomes an error boundary if it defines either (or both) of the lifecycle methods static getDerivedStateFromError() or componentDidCatch() .
Read more >'errorboundary' cannot be used as a jsx component - You.com
'ReactErrorBoundary' cannot be used as a JSX component. Its instance type 'ErrorBoundary' is not a valid JSX element. The types returned by 'render()'...
Read more >Component cannot be used as a JSX component in React
The error Component cannot be used as a JSX component occurs for multiple reasons, returning an array of JSX elements instead of a...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
I also have the same issue.
package.json
This issue is caused by the breaking change from @types/react v18.
Use command
npm ls @types/react
to see if you have any@types/react@18.x
in your dependencies.You can upgrade react v18, or update
@types/react@17.x
version in your lock file.Checkout the solution from these comments: