Routing not working when running app with Production Config

[anupamvijayvergia]

Opening a new window with specifc page is redirecting back to index route. This behavior is only happening when running the application with npm run start. Routes are working properly when running the application with num run dev .

childWindow.loadURL(`file://${__dirname}/app.html#/${containerId}/second`);

Routes are setup as below.

<App>
    <Switch>
      <Route path="/signup" component={SignUpContainer} />
      <Route path="/home" component={HomeContainer} />
      <Route path="/:containerId/second" component={SecondContainer} />
      <Route path="/" component={SplashContainer} />
    </Switch>
  </App>

[anupamvijayvergia]

I've found the issue. For anyone else facing the same problem, Replace ConnectedRouter with HashRouter in Root.js

According to react-router docs, you should HashRouter if you are using a static file server, Since after build files are served as static files and not from a server.

[vikr01]

ConnectedRouter should not be removed @anupamvijayvergia, that's part of the redux uses in this project.

This is less a solution and more of a workaround.

You'd need to tell your server to "handle all other routes" with the correct path. With express, you would set a route *.

[cloudstr21]

i am experiencing same issue here. @vikr01 could you please explain how to to that?

[SimantoR]

My understanding was the same regarding HashRouter. This is my entrypoint code

ReactDOM.render(
    <HashRouter basename="/">
        <App />
    </HashRouter>,
    rootElement
);

And this is my Switch-Route setup

<Switch>
    <Route exact path="/">
        <Landing dbManager={dbManager} printer={printer} />
    </Route>
    <Route path="/settings">
        <Settings dbManager={dbManager} printer={printer} />
    </Route>
    {/* No Path */}
    <Route>
        <p>
            Sorry go back to {' '}<NavLink to='/'>home page</NavLink>
        </p>
    </Route>
</Switch>

Warning I get:

Warning: Hash history cannot PUSH the same path; a new entry will not be added to the history stack

[hot-gril]

Nothing worked. I looked at like 10 different answers for this. Eventually figured this out through trial and error, works in both dev and prod:

win.loadURL(`file://${electron.remote.app.getAppPath()}/app.html#/yourroutename`)

__dirname works only in dev.

I wrote an SO answer with more details: https://stackoverflow.com/a/63441289/1884363