fixed ‘Switch’ is not exported from ‘react-router-dom’

 

I also faced the same problem, and I searched the Internet so much, but I didn’t get any answer according to my question.

So I uninstalled version 6 of react-router-dom:

npm uninstall react-router-dom

And installed version 5.2.0 of react-router-dom:

npm install react-router-dom@5.2.0

use below 
import {
BrowserRouter as Router,
Switch,
Route,
Link
} from "react-router-dom";



export default class App extends Component {

render() {
return <div>
<Router>
< Navbar />
<Switch>
<Route path="/business">
<News pageSize={4} category="business"/>
</Route>

<Route path="/entertainment">
<News pageSize={4} category="entertainment"/>
</Route>

<Route path="/general">
<News pageSize={4} category="general"/>
</Route>
</Switch>


</Router>
</div>;
}
}

reference - Link Here



For v6 use below

import React, { Component } from 'react';
import Navbar from './Components/Navbar';
import News from './Components/News';

import { BrowserRouter as Router, Route, Routes } from 'react-router-dom'
export default class App extends Component {

render() {
return <div>
<Router>
< Navbar />
<Routes>
<Route exact path="/" element={<News pageSize={8} category="general"/>}/>
<Route exact path="/business" element={<News pageSize={4} category="business"/>}/>
<Route exact path="/entertainment" element={<News pageSize={4} category="entertainment"/>}/>
<Route exact path="/general" element={<News pageSize={4} category="general"/>}/>
</Routes>
</Router>
</div>;
}
}







Leave a Comment

Your email address will not be published. Required fields are marked *