Angular 2 Routes Breaking on Electron App Refresh


Hi, I am new to Electron and trying out an app with Angular 2. The app runs fine after build and execution of Electron, but when Electron is refreshed only a blank html document is visible. It only happens when using Angular 2 routes. I’m sure it has to do with me not understanding the BrowserWindow model, but I can’t figure out the solution. Is this something anyone has ran into?


I’ve been struggling with exact same issue, to the point that I’m even considering an alternative to routing. Did you find a solution for this?


Unfortunately no, and I didn’t have the time luxury to figure it out. I ended up moving over to React over Angular 2 and everything seems good so far.


For anyone else who comes across this, I believe the issue is due to Angular 2 using an html 5 style url as opposed to a hashbang style url. I can’t confirm as I moved on to React, but I came into the same issue using React browserHistory. Using Reacts hash style history works just fine.

So the answer would be is see if Angular 2 can use hashbang Urls or figure out how to configure Electron to understand html5 style routes.


I’ve found a solution by setting useHash to true.

  imports: [
    RouterModule.forRoot(routes, { useHash: true })  // .../#/crisis-center/

For more info see:!#browser-url-styles


first you should add this to imports
imports: [
RouterModule.forRoot(routes, { useHash: true }) // add :{ useHash: true }
than change <base href="./"> to <base href="">