bug: ionic react does not support history@5.x

Bug Report

Ionic version:

[ ] 4.x [x] 5.6.6

Current behavior:

In Ionic React, the nested route declared is not rendered when navigated to the corresponding url after upgrading to the latest version of ionic(5.6.6)

Expected behavior:

The nested route is rendered.

Steps to reproduce:

Please check this link for the code. This is from the example of nested navigation from the ionic docs, but the ionic packages have been updated to version 5.6.6 - https://stackblitz.com/edit/ionic-react-routing-bhuvg6?file=src/index.tsx

Related code:

App.tsx

  <IonApp>
    <IonReactRouter>
      <IonRouterOutlet>
        <Route path="/dashboard" render={props => <DashboardPage {...props} />} />
        <Route exact path="/" render={() => <Redirect to="/dashboard" />} />
      </IonRouterOutlet>
    </IonReactRouter>
  </IonApp>

DashboardPage.tsx

    <IonRouterOutlet>
      <Route exact path={match.url} component={UsersListPage} />
      <Route path={`${match.url}/users/:id`} component={UserDetailPage} />
    </IonRouterOutlet>

Ionic info:

Ionic:

   Ionic CLI       : 6.10.1 (C:\Users\justi\AppData\Roaming\npm\node_modules\@ionic\cli)
   Ionic Framework : @ionic/react 5.6.6

Capacitor:

   Capacitor CLI   : not installed
   @capacitor/core : 2.4.7

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v12.19.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.14.8
   OS     : Windows 10

[justinpathrose]

React Router v5 expects history@4.x, so I do not recommend using history@5.x right now since you may run into other errors.

React Router v6 will be using history@5.x, so I do still think we should support this in Ionic React.

Can you try the following dev build and let me know if it resolves the issue?

npm install @ionic/[e-mail]72e07 @ionic/[e-mail]72e07

Thank you! Both the solutions worked for me.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.