title: Angular(5) - lazy loading and canActivate guard - StaticInjectorError
body: <p>So, we have quite a big app and we started working on optimizations.... one of the optimizations were lazy loading some parts.... </p>
  
  <p>so we have Demo pages with whole load of example usage that we DON'T want anywhere but on out DEV environment...</p>
  
  <p>so lazy loading that part was quite easy...</p>
  
  <p>in our app-routing module we have</p>
  
  <pre><code>const routes: Routes = [
      ...
      {path: 'design', canActivate: ['DevOnlyGuard'], loadChildren: 'app/pages/demo/demo.module#DemoPagesModule'},
      ...
  ];
  
  @NgModule({
    imports: [RouterModule.forRoot(routes)],
    exports: [RouterModule]
  })
  export class AppRoutingModule { }
  </code></pre>
  
  <p>So without canActivate route all works fine and demo routes are loaded lazily...</p>
  
  <p>now, if I add this canActivate in my guard, that looks like this</p>
  
  <pre><code>import { Injectable } from '@angular/core';
  import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, CanActivateChild } from '@angular/router';
  import { environment } from 'environments/environment';
  
  @Injectable()
  export class DevOnlyGuard implements  CanActivate, CanActivateChild {
    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
      return (environment.envName === 'dev');
    }
  
    canActivateChild(route: ActivatedRouteSnapshot, state: RouterStateSnapshot): boolean {
      return this.canActivate(route, state);
    }
  }
  </code></pre>
  
  <p>I am getting this error once I hit the demo route:</p>
  
  <blockquote>
    <p>ERROR Error: Uncaught (in promise): Error:
    StaticInjectorError[DevOnlyGuard]:<br>
    StaticInjectorError[DevOnlyGuard]: 
        NullInjectorError: No provider for DevOnlyGuard! Error: StaticInjectorError[DevOnlyGuard]:  ....</p>
  </blockquote>
  
  <p>even if I added the Guard to the list of providers in my app.module
  like</p>
  
  <pre><code>providers: [
      ...
      DevOnlyGuard,
  ];
  </code></pre>
  
  <p>Any ideas?</p>