Angular route issue with new created forge project



  • electron-forge, 5.1.1
  • electron-compile, 6.4.2
  • angular, 5.2.9


  • Created the electron project with forge template. And everything works.
    • npm install -g electron-forge
    • electron-forge init my-new-project --template=angular2
    • cd my-new-project
    • npm start
  • Created the angular project with cli in separate folder, and angular is up and running in browser.
  • Migrated the angular files under the src folder in electron project.
  • Added angular related denpendencies in electron project, such like @angular/router.
  • By now with these files under src folder, the electron app runs great.
    • index.ts
    • index.html
    • bootstrap.ts
    • app.component.ts
    • app.component.html
    • app.component.css
    • app.module.ts
  • Then I just added these files
    • app-routing.module.ts
    • roles
      • roles.module.ts
      • roles-routing.module.ts
      • roles.component.ts
      • roles.component.html
  • Update these files
    • index.html with in the head section.
    • app-routing.module.ts
      const routes: Routes = [
      path: 'roles',
      loadChildren: 'roles/roles.module#RolesModule'
      path: '',
      redirectTo: 'roles',
      pathMatch: 'full'
    • roles-routing.module.ts
      const routes: Routes = [
      path: '',
      component: RolesComponent,

All these changes all working with angular along in the browser. But errors in electron app.

Any help would be appreciated.


If I setup the angular route without lazy loading, it works. Without it, I have to define all the routes in AppRoutingModule for those components which sit in any other feature modules. It is definitely terrible. Can someone help confirm that Electron does not support angular route lazy loading, please?


Electron does not support the lazy loading. Also you have to set the template url like this templateUrl: ‘./roles/roles.component.html’. You have to include the subfolder name.

This is the root cause.