title: Angular 2 - Unexpected Module declared by AppModule
body: <p>I am new to angular and trying to separate my modules in Angular2 app having the following directory structure.</p>
  
  <p>I have my module and other components declared in the AppModule, but I am getting an error in browser console that <code>Unexpected HomeModule declared by AppModule</code></p>
  
  <pre><code>app
  --authentication
  ---- htmls, ts, css
  --home
  ----dashboard
  --------html, ts, css
  ----representativs
  --------html, ts, css
  ----home-routing.module.ts
  ----home.module.ts
  --app.routing.ts
  --app.module.ts
  </code></pre>
  
  <p>app.module.ts</p>
  
  <pre><code>import { routing } from "./app.routing"
  import { AppComponent } from './app.component';
  import { HomeModule } from "./home/home.module";
  
  @NgModule({
    imports: [BrowserModule, routing, HttpModule, ReactiveFormsModule],
    declarations: [ AppComponent, HomeModule],
    bootstrap: [AppComponent],
    providers: [UserAuthenticationService]
  })
  export class AppModule { }
  </code></pre>
  
  <p>home.module.ts</p>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { DashboardComponent } from './dashboard/dashboard.component';
  import { RepresentativesComponent } from './representatives/representatives.component';
  import { HomeRoutingModule } from "./home-routing.module";
  
  @NgModule({
      imports: [
          HomeRoutingModule
      ],
      declarations: [
          DashboardComponent,
          RepresentativesComponent,
      ]
  })
  export class HomeModule { }
  </code></pre>
  
  <p>home-routing.ts</p>
  
  <pre><code>const homeRoutes: Routes = [
      {
          path: 'home',
          component: HomeComponent,
          children: [
              {
                  path: "representatives",
                  component: RepresentativesComponent
              },
              {
                  path: "dashboard",
                  component: DashboardComponent
              },
              {
                  path: "",
                  redirectTo: "dashboard",
                  pathMatch: "full"
              }
          ]
      }
  ]
  
  @NgModule({
      imports: [
          RouterModule.forChild(homeRoutes)
      ],
      exports: [
          RouterModule
      ]
  })
  export class HomeRoutingModule { }
  </code></pre>
  
  <p>app.routing.ts</p>
  
  <pre><code>import { AuthenticationComponent } from "./authentication/authentication.component";
  import { HomeComponent } from "./home/home.component";
  
  const routes: Routes = [
      { 
          path: 'auth/:action', 
          component: AuthenticationComponent 
      },
      {
          path: 'auth',
          redirectTo: 'auth/signin',
          pathMatch: 'prefix'
      },
      {
          path: '',
          redirectTo: 'home',
          component: HomeComponent
      }
  ]
  
  export const routing = RouterModule.forRoot(routes);
  </code></pre>