Typescript error 'Router' cannot be used as a JSX component.

[Blaz-Strusnik]

Failed to compile.

/app/src/index.tsx
TypeScript error in /app/src/index.tsx(8,4):
'Router' cannot be used as a JSX component.
Its instance type 'BrowserRouter' is not a valid JSX element.
The types returned by 'render()' are incompatible between these types.
Type 'React.ReactNode' is not assignable to type 'import("/node_modules/@types/react-transition-group/node_modules/@types/react/ts5.0/index").ReactNode'. TS2786

     6 | 
     7 | ReactDOM.render(
  >  8 |   <Router>
       |    ^
     9 |     <App />
    10 |   </Router>,
    11 |   document.getElementById('root')

[itsMagondu]

+1

[Robowizx]

The issue is occurring due to using old type definitions of React and react router. Can upgrade the types packages under the package.json file to newer ones to avoid getting that error. I personally upgraded the following to fix it.

"@types/react": "^18.2.52",
"@types/react-dom": "^18.2.18",
"@types/react-router-dom": "^5.3.3",