Electron react app routing returns blank page in production

Hey so i finally finished my react electron app and it works well in development however, it returns blank pages when i click on a button on the homescreen to direct me to a different page.

Attempted solutions

• I do use HashRouter instead of normal Router
• Tried adding a # at the end of file://${path.join(__dirname, "../build/index.html#")}

Problem Basically the Main Menu at route "/" shows up and so does the backgroundProcess window but when i click on a button to direct me to /slow or /fast etc it returns a blank page

My windows in main.js file:

mainWindow.loadURL(isDev ? "http://localhost:3000" : `file://${path.join(__dirname, "../build/index.html#")}`);
backgroundProcess.loadURL(isDev ? "http://localhost:3000" : `file://${path.join(__dirname, "../build/woker.html")}`)
configWindow.loadURL(isDev ? `http://localhost:3000#/config${mode.toString()}` : `file://${path.join(__dirname, `../build/index.html#config${mode}`)}`);
AbiWindow.loadURL(isDev ? "http://localhost:3000#/abi" : `file://${path.join(__dirname, "../build/index.html#abi")}`);

App.js routing:

  <HashRouter>
      <Route exact path='/' component={Mainmenu}/>
      <Route exact path='/fast' component={Fast}/>
      <Route exact path='/config0' component={ConfigWindow}/>
      <Route exact path='/abi' component={AbiWindow}/>
      <Route exact path='/slow' component={Slow}/>
      <Route exact path='/config1' component={SlowConfig}/>
      <Route exact path='/sell' component={Sell}/>
      <Route exact path='/config2' component={SellConfig}/>
  </HashRouter>

MainMenu Button routing:

function MainMenu() {
    return ( 
        <div className='no-gutters'>
            <div className='col no-gutters'>
                <div className='fast d-flex justify-content-center align-items-center'>
                    <Link className='fastbtn' to="/fast">FAST</Link>
                </div>
            </div>
            <div className='col no-gutters'>
                <div className='slow d-flex justify-content-center align-items-center'>
                    <Link className='slowbtn' to="/slow">SLOW</Link>
                </div>
            </div>
            <div className='col no-gutters'>
                <div className='sell d-flex justify-content-center align-items-center'>
                    <Link className='sellbtn' to="/sell">SELL</Link>
                </div>
            </div>
        </div>
     );
}

Any help is greatly appreciated Thanks in advance :)