Type ‘BrowserRouter’ is missing the following properties… – TypeScript

I’m learning TypeScript and I’m trying to add TypeScript into my pet project. In the ReactDOM.render function call I’m getting this error:

No overload matches this call. The last overload gave the following
error.

Argument of type ‘BrowserRouter’ is not assignable to parameter of type ‘ReactElement<any, string | ((props: any) => ReactElement<any,
any> | null) | (new (props: any) => Component<any, any, any>)>[]’.

Type ‘BrowserRouter’ is missing the following properties from type ‘ReactElement<any, string | ((props: any) => ReactElement<any,
any> | null) | (new (props: any) => Component<any, any, any>)>[]’:
length, pop, push, concat, and 26 more.

Here is the code:

import React from 'react';
import ReactDOM from "react-dom";
import { BrowserRouter as Router } from 'react-router-dom';
import { Provider } from 'react-redux';

import App from "./App";
import configureStore from './store';

const store = configureStore();

ReactDOM.render(
    <Router>
        <Provider store={store}>
            <App />
        </Provider>
    </Router>, 
    document.getElementById("root")
);

package.json

{
  "name": "WhatToCook",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1",
    "start": "webpack-dev-server --mode development --open --hot"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/cli": "^7.12.13",
    "@babel/core": "^7.12.13",
    "@babel/plugin-proposal-class-properties": "^7.12.13",
    "@babel/preset-env": "^7.12.13",
    "@babel/preset-react": "^7.12.13",
    "@types/react-dom": "^17.0.3",
    "@types/react-redux": "^7.1.16",
    "@types/react-router-dom": "^5.1.7",
    "babel-loader": "^8.2.2",
    "css-loader": "^1.0.1",
    "style-loader": "^0.23.1",
    "webpack": "^4.46.0",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.2"
  },
  "dependencies": {
    "lodash": "^4.17.20",
    "react": "^17.0.1",
    "react-addons-update": "^15.6.3",
    "react-dom": "^17.0.1",
    "react-hot-loader": "^4.13.0",
    "react-jss": "^10.5.1",
    "react-redux": "^7.2.2",
    "react-router-dom": "^5.2.0",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0"
  }
}

I tried to install the type dependencies for all packages that I’m using in this file but it doesn’t help.

Source: Ask Javascript Questions

LEAVE A COMMENT