Route needs to be direct children of Routes

import {
  BrowserRouter as Router,
  Route, 
  Routes,
  Link 
} from 'react-router-dom'

 <Router>
      <div>
        <nav className="navbar navbar-expand-lg navbar-light bg-light">
          <Link className="navbar-brand" to="/">Logo</Link>
          <div className="navbar-nav">
            <Link className="nav-item nav-link" to="/">Home</Link>
            <Link className="nav-item nav-link" to="/premium">About Me</Link>
          </div>
        </nav>
      </div>
    <Routes>
      <Route path="/" element={() => <h4>Home</h4>}></Route>
      <Route path="/premium" element={() => <h4>About Me</h4>}></Route>
    </Routes>
</Router>

Based on OPs comment about the routes working but the routed content not rendering I will assume react-router-dom@6 is installed and working. The Route component API changed quite a bit from v5. Route components can only be rendered by the Routes component (the spiritual successor to RRDv5's Switch component) or by another Route component in the case of nested routes. Gone are the component, and render and children function props, replaced by a single element prop taking a ReactNode, a.k.a. JSX.

• Wrap the Route components in a Routes component
• Render the routed content on the Route component's element prop

Example:

import './App.css';
import {
  BrowserRouter as Router,
  Routes,  // <-- import Routes component
  Route,
  Link
} from 'react-router-dom';

function App() {
  return (
    <Router>
      <div>
        <nav className="navbar navbar-expand-lg navbar-light bg-light">
          <Link className="navbar-brand" to="/">Logo</Link>
          <div className="navbar-nav">
            <Link className="nav-item nav-link" to="/">Home</Link>
            <Link className="nav-item nav-link" to="/premium">About Me</Link>
          </div>
        </nav>
      </div>
      <Routes> // <-- wrap routes in `Routes` component
        <Route
          path="/"
          element={<h4>Home</h4>} // <-- JSX on element prop
        />
        <Route
          path="/premium"
          element={<h4>About Me</h4>} // <-- JSX on element prop
        />
      </Routes>
    </Router>
  );
}

export default App;

For making a navbar you don't need the BrowserRouter or Route components, just the Link from react-router-dom

as shown in the quick start guide: reactrouter.com/QuickStart#Navigation

function Home() {
  return (
    <div>
      <h1>Home</h1>
      <nav>
        <Link to="/">Home</Link> |{" "}
        <Link to="about">About</Link>
      </nav>
    </div>
  );
}

also, the navbar should be put as an element attribute of a Route following this approach:

<BrowserRouter>
    <Routes>
      <Route path="/" element={<App />}>
        <Route index element={<Home />} />
        <Route path="teams" element={<Teams />}>
          <Route path=":teamId" element={<Team />} />
          <Route path="new" element={<NewTeamForm />} />
          <Route index element={<LeagueStandings />} />
        </Route>
      </Route>
    </Routes>
  </BrowserRouter>