angular - Angular2 - app.module routing: blank path not redirecting to component -

i've added login feature app. when navigates url blank path(http://example.com), want homecomponent show activate authguard, keep url path blank. still testing locally, may issue? i'm not sure.

whats happening - when navigate localhost:3000/ nothing, blank screen. when navigate localhost:3000/home, homecomponent show no issue homecomponent called when url localhost:3000/.

here's app.module file - i'm not sure other files need post since issue lies routing. said, can of other components typing path. home, not want have type path.

app.module.ts

   import { ngmodule } '@angular/core';    import { browsermodule } '@angular/platform-browser';    import { formsmodule, reactiveformsmodule } '@angular/forms';    import { httpmodule } '@angular/http';    import { routermodule, routes } '@angular/router';     import { appcomponent }  './app.component';     import { homecomponent } './home/home.component';     import { logincomponent } './login/login.component';    import { alertservice } './login/services/alert.service';    import { alertcomponent } './directives/alert.component';    import { authenticationservice } './login/services/authentication.service';    import { authguard } './guards/auth.guard';  @ngmodule({ imports: [      browsermodule,     formsmodule,     reactiveformsmodule,     httpmodule,     routermodule.forroot([          { path: '', component: homecomponent, pathmatch: 'full', canactivate: [authguard] },         { path: 'home', component: homecomponent, canactivate: [authguard] },         { path: 'login', component: logincomponent },         { path: '**', redirectto: '', pathmatch: 'full' }        ])  ], providers: [     authguard,     alertservice,     authenticationservice ], declarations: [      logincomponent,     alertcomponent,     homecomponent,     appcomponent, ], bootstrap: [ appcomponent ] }) export class appmodule { } 

i have tried setting default route this, still same issue:

{ path: '', redirectto: 'home', pathmatch: 'full' }, { path: 'home', component: homecomponent, pathmatch: 'full', canactivate: [authguard] }, 

my base href set to:

<base href="/" /> 

i'm not receiving errors , console looks clean. again, can navigate fine if add "/home" end of url, want blank url path show homecomponent authguard.

i've been through documentation , other questions nothing has worked me. i'm not sure i'm missing. appreciated. let me know if there other code snippets need post. in advance.

the routing in angular 2 depends, in many other frameworks, on order of routes.

your first route path: '' matches each request , going executed. if user not authorized guard blocking request.

it's recommended sort routes more specific less specific this:

{ path: 'home', component: homecomponent, canactivate: [authguard] }, { path: 'login', component: logincomponent }, { path: '', redirectto: '/home', pathmatch: 'full' }, { path: '**', redirectto: '/' } 

with configuration request localhost:3000/ catched last route , redirect /home. route '**' catch every request not covered in route configuration , redirect / redirect home.

i don't know if matters, base set <base href='/' />. documentation of angular says must <base href='/'>.