Attempted import error: 'Switch' is not exported from 'react-router-dom'

Question

I don't know why I am getting this error and I can't find an answer for it anywhere. I have uninstalled the react-router-dom package and reinstalled it, but it continues to tell me that the switch module is not exported from react-router-dom. Here's my code.

Error I'm getting: Attempted import error: 'Switch' is not exported from 'react-router-dom'.

`

    import React from "react";
    import "./App.css";
    import NavBar from "./components/navbar.js";
    import Footer from "./components/footer.js";
    import Home from "./components/pages/homepage/home.js";
    import { BrowserRouter as Router, Switch, Route, Link } from "react-router-dom";
    
    function App() {
      return (
        <Router>
          <div className="app-container">
            <NavBar />
            <Switch>
              <Route path="/home" component={Home} />
            </Switch>
            <Footer />
          </div>
        </Router>
      );
    }
    
    export default App;

`

Answer 1

Switch is exported from react-router and not react-router-dom (the same goes for Route I think).

Answer 2

If you are using react-router-dom v6 it looks like 'Switch' has been replaced with 'Routes'

Answer 3

What is your react-router-dom version?

"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",

if is above one then you need to remove node-modules and reinstall node-module using npm install --save