title: Angular can't find custom module
body: <p>I'm trying to convert my Angular 7 app to use modules so that I get lazy loading. When I run with modules the browser says</p>
  
  <blockquote>
    <p>core.js:18374 ERROR Error: Uncaught (in promise): Error: Cannot find module './orders/orders.module'<br>
    Error: Cannot find module './orders/orders.module'</p>
  </blockquote>
  
  <p>I'm not sure why that's happening as the <code>.../src/app/orders/orders.module.ts</code> file definitely exists. Originally I just had a <code>.../src/app/orders</code> directory and in it multiple components.  To implement the modules I did this</p>
  
  
  
  <pre><code>% mv src/app/orders orders
  % ng g m orders --routing
  % mv orders/* src/app/orders
  </code></pre>
  
  <p>I then removed all the routes from <code>app-routing.module.ts</code> and replaced it with this, so that by default when you go to the app it takes you to the orders list.</p>
  
  
  
  <pre class="lang-js prettyprint-override"><code>{
      path: 'orders',
      loadChildren: './orders/orders.module#OrdersModule'
  },
  {
      path: '',
      redirectTo: 'orders',
      pathMatch: 'full'
  }
  </code></pre>
  
  <p>And then <code>orders-routing.module.ts</code> looks like so:</p>
  
  <pre class="lang-js prettyprint-override"><code>import {NgModule} from '@angular/core';
  import {RouterModule, Routes} from '@angular/router';
  import {OrderEditComponent} from './order-edit/order-edit.component';
  import {OrderListComponent} from './order-list/order-list.component';
  
  const routes: Routes = [
      {path: 'edit', component: OrderEditComponent},
      {path: 'byMonth', component: OrderListComponent},
      {path: '', component: OrderListComponent},
  ];
  
  @NgModule({
      imports: [RouterModule.forChild(routes)],
      exports: [RouterModule]
  })
  export class OrdersRoutingModule {
  }
  </code></pre>
  
  <p>orders.module looks like so:</p>
  
  <pre class="lang-js prettyprint-override"><code>import {NgModule} from '@angular/core';
  import {CommonModule} from '@angular/common';
  
  import {OrdersRoutingModule} from './orders-routing.module';
  import {OrderListComponent} from './order-list/order-list.component';
  import {OrderEditComponent} from './order-edit/order-edit.component';
  
  @NgModule({
      declarations: [
          OrderListComponent,
          OrderEditComponent
      ],
      imports: [
          CommonModule,
          OrdersRoutingModule
      ]
  })
  export class OrdersModule {
  }
  </code></pre>
  
  <p>You can see the files exist in the proper spot.</p>
  
  <p><a href="https://i.stack.imgur.com/g3qcQ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/g3qcQ.png" alt="enter image description here"></a></p>