Pesquisar na Comunidade

Estou recebendo o erro abaixo: Error: Invariant failed: You should not use <Link> outside a <Router> import React, { Component } from "react"; import { Link } from 'react-router-dom'; export default class Product extends Component { render() { return ( <> <h1>Product</h1> <ul> <li><Link to='/'>Home</Link></li> </ul> </> ); } } import React from 'react'; import { BrowserRouter, Switch, Route } from 'react-router-dom'; import Main from './pages/main'; import Product from "./pages/product"; const Routes = () => ( <BrowserRouter> <Switch> <Route exact path="/" component={Main} /> <Route path="/products" component={Product} /> </Switch> </BrowserRouter> ); export default Routes; import Routes from "./routes"; // import api from './services/api'; import './styles.css'; import Main from './pages/main'; import Header from './components/Header'; function App() { return ( <div className="App"> <Header /> <Main /> <Routes /> </div> ); } export default App;