'Simple React Routes not showing up

I am following a very simple tutorial on react routes, and for some reason, this code block does not render the component on the screen. Here is my code in App.js:

import React from "react";
import "./App.css";
import { BrowserRouter as Router, Route } from "react-router-dom";
import SigninPage from "./pages/signin";

function App() {
  return (
    <Router>
      <div>
        <Route path="/" component={SigninPage} exact />
      </div>
    </Router>
  );
}

export default App;

If I replace <Route path="/" component={SigninPage} exact /> with <SigninPage />, then the component shows up.

I have no warnings or errors, and my react-router-dom version is 6.0.0-beta.0. I have tried running npm start again and restarting my computer. I very much appreciate any help.

EDIT:

I figured it would be useful to include signin.js:

import React from "react";

const SigninPage = () => {
  return (
    <div>
      <h1>Signin</h1>
    </div>
  );
};

export default SigninPage;


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source