Firebase serve doesn't include other pages in React

Question

I've got a React app using React-Router with the following in index.js:

render(
  <Router>
    <Switch>
      <Route exact path="/">
        <Main />
      </Route>
      <Route path="/privacy">
        <Privacy />
      </Route>  
    </Switch>
  </Router>,
  document.getElementById("root")
);

When doing yarn build then serve -s build, I can visit localhost:5000/privacy and see the privacy page, but when I do firebase serve the same URL gives a 404.

My firebase hosting config is set to the build/ folder as well, so they should both be reading from the same folder. I can also see other updates to the / path just fine, it's just other links don't work.

So my question is: Why doesn't firebase serve include the other pages?

Answer 1

So I seemed to have fixed my issue. Here's the steps that I took:

1. Rerun firebase init
2. Put build as my public dir again
3. When it asks to configure as a single-page app, select Yes
4. Complete rest as normal

After that, I ran firebase serve and could see my other pages at their right URLs.