[Solved] ‘TimeAgo’ cannot be used as a JSX component

I am using react-timeago in my project But I am facing the following JSX Component Error: ‘TimeAgo’ cannot be used as a JSX component in TypeScript. We are going to Learn about All Possible Solutions So Lets Get Start with This Article.

How ‘TimeAgo’ cannot be used as a JSX component Error Occurs?

I am using react-timeago in my project But I am facing the following JSX Component Error.

'TimeAgo' cannot be used as a JSX component.

So here I am writing all the possible solutions that I have tried to resolve this error.

How To Solve ‘TimeAgo’ cannot be used as a JSX component Error?

Solution 1: Add resolutions to Your package.json

React released his major version React 18 and Might be that is the Reason for this error But As I added resolutions to my package.json file My error was solved. Just add these lines to your package.json file.

"resolutions": {
  "@types/react": "17.0.2",
  "@types/react-dom": "17.0.2"
},

Now, we are specifying strict restrictions for dependencies of dependencies and your error must be solved now.

Solution 2: add npm-force-resolutions in npm script

If You are using NPM and Your error is still not resolved then just open your package.json file and add the following line in your script section.

  "scripts": {
    ...
    "preinstall": "npm install --package-lock-only --ignore-scripts && npx npm-force-resolutions"
    ...
  },

Now, Your error must be solved.

Summary

It’s all About this error. Hope We solved Your error. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you?

Also, Read

• Module not found: Can’t resolve ‘web-vitals’ in React 18