Ionic layout with react( blank page )

Hi, I am making this spa using Ionic4-React. My app works just fine if I set a page like this:

// …

render() {
    return (
      <IonPage>
        <MainMenu />
        <IonContent>
          <h1>My Page</h1>
        </IonContent>
      </IonPage>
    );
  };

But if I use in my App component the code like this:

const App = () => (
  <IonApp>
    <IonReactRouter>
      <IonSplitPane contentId="main">
        <Menu appPages={appPages} />
          <IonPage>
            <MainMenu />
            <IonContent>
              <IonRouterOutlet id="main">
                <Route path="/home" component={Home} exact={true} />
                <Route path="/categories" component={Categories} exact={true} />
                <Route path="/product/:id" component={Product} exact={true} />
                <Route exact path="/" render={() => <Redirect to="/home" />} />
              </IonRouterOutlet>
            </IonContent>
          </IonPage>
      </IonSplitPane>
    </IonReactRouter>
  </IonApp>
);
export default App;

I got a blank page!!!. I try to write less that’s why I did that.

Any advice is welcome, thanks, Alexis