title: Angular7 - Error while implementing lazy-loading
body: <p><strong>I am getting below error while implementing lazy-loading using angular 7.
  Whenever running command <code>ng serve</code> below error is populated on cmd.</strong></p>
  
  <p><strong>20% building modules 91/93 modules 2 active ...Web\src\assets\bootstrap\bootstrap.scss× ｢wdm｣: Error: No module factory available for dependency type: ContextElementDependency
          at addDependency</strong> (E:\New folder\node_modules\webpack\lib\Compilation.js:671:12)
          at iterationOfArrayCallback (E:\New folder\node_modules\webpack\lib\Compilation.js:186:3)
          at addDependenciesBlock (E:\New folder\node_modules\webpack\lib\Compilation.js:689:5)
          at iterationOfArrayCallback (E:\New folder\node_modules\webpack\lib\Compilation.js:186:3)
          at addDependenciesBlock (E:\New folder\node_modules\webpack\lib\Compilation.js:692:5)
          at Compilation.processModuleDependencies (E:\New folder\node_modules\webpack\lib\Compilation.js:700:4)
          at afterBuild (E:\New folder\node_modules\webpack\lib\Compilation.js:832:15)
          at buildModule.err (E:\New folder\node_modules\webpack\lib\Compilation.js:876:11)
          at callback (E:\New folder\node_modules\webpack\lib\Compilation.js:613:5)
          at module.build.error (E:\New folder\node_modules\webpack\lib\Compilation.js:653:12)
          at resolveDependencies (E:\New folder\node_modules\webpack\lib\ContextModule.js:282:4)
          at ContextModule.result.resolveDependencies (E:\New folder\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:522:25)
          at ContextModule.build (E:\New folder\node_modules\webpack\lib\ContextModule.js:203:8)
          at Compilation.buildModule (E:\New folder\node_modules\webpack\lib\Compilation.js:618:10)
          at factory.create (E:\New folder\node_modules\webpack\lib\Compilation.js:859:14)
          at hooks.afterResolve.callAsync (E:\New folder\node_modules\webpack\lib\ContextModuleFactory.js:163:16)
      E:\New folder\node_modules\neo-async\async.js:14
          throw new Error('Callback was already called.');
          ^</p>
  
  <pre><code>Error: Callback was already called.
      at throwError (E:\New folder\node_modules\neo-async\async.js:14:11)
      at E:\New folder\node_modules\neo-async\async.js:2805:7
      at process._tickCallback (internal/process/next_tick.js:61:11)
  </code></pre>
  
  <h2>app.routing.ts</h2>
  
  <pre><code>const routes: Routes = [
      {
          path: '', redirectTo: 'login', pathMatch: 'full'
      },
          { path: 'login', loadChildren: 'app/components/login/login.module#LoginModule'}   &lt;--- causing error
  ]
  </code></pre>
  
  <p>However, using routing as below is below is working finr:-</p>
  
  <pre><code>const routes: Routes = [
      {
          path: '', redirectTo: 'login', pathMatch: 'full'
      },
          { path: 'login', component:LoginComponent} &lt;--- working  fine
  ]
  </code></pre>
  
  <h2>package.json</h2>
  
  <pre><code>"dependencies": {
              "@angular/animations": "^7.0.3",
              "@angular/common": "^7.0.3",
              "@angular/compiler": "^7.0.3",
              "@angular/core": "^7.0.3",
              "@angular/forms": "^7.0.3",
              "@angular/http": "^7.0.3",
              "@angular/platform-browser": "^7.0.3",
              "@angular/platform-browser-dynamic": "^7.0.3",
              "@angular/platform-server": "^7.0.3",
              "@angular/pwa": "^0.10.6",
              "@angular/router": "^7.0.3",
              "@angular/service-worker": "^7.0.3",
              "@ng-bootstrap/ng-bootstrap": "^4.0.0",
              "@types/lodash": "^4.14.116",
              "core-js": "^2.5.7",
              "font-awesome": "^4.7.0",
              "hammerjs": "^2.0.8",
              "ng-connection-service": "^1.0.4",
              "ngx-perfect-scrollbar": "^6.3.1",
              "ngx-toastr": "^9.1.0",
              "ngx-ui-switch": "^1.6.0",
              "rxjs": "^6.3.3",
              "rxjs-compat": "^6.3.3",
              "web-animations-js": "2.3.1",
              "zone.js": "^0.8.26"
          },
          "devDependencies": {
              "@angular-devkit/build-angular": "^0.10.5",
              "@angular/cdk": "^7.0.3",
              "@angular/cli": "^7.0.5",
              "@angular/compiler-cli": "^7.0.3",
              "@angular/language-service": "^7.0.3",
              "@angular/material": "^7.0.3",
              "@types/jasmine": "^2.8.11",
              "@types/jasminewd2": "~2.0.2",
              "@types/node": "^10.12.6",
              "codelyzer": "^4.5.0",
              "jasmine-core": "^3.3.0",
              "jasmine-spec-reporter": "^4.2.1",
              "karma": "^3.1.1",
              "karma-chrome-launcher": "^2.2.0",
              "karma-cli": "^1.0.1",
              "karma-coverage-istanbul-reporter": "^1.4.3",
              "karma-jasmine": "^1.1.2",
              "karma-jasmine-html-reporter": "^1.4.0",
              "node-sass": "^4.9.3",
              "protractor": "^5.4.1",
              "rxjs-tslint": "^0.1.5",
              "ts-node": "~4.1.0",
              "tslint": "^5.11.0",
              "typescript": "^3.1.6",
              "webpack": "^4.20.2"
          }
  </code></pre>
  
  <h2>app.module.ts</h2>
  
  <pre><code>@NgModule({
      declarations: [
          AppComponent
      ],
      imports: [
          BrowserModule,,
          FormsModule,
          HttpClientModule,
          BrowserAnimationsModule,
          NoopAnimationsModule,
          AppRoutingModule
      ],
      providers: [
          HttpService,
          AuthGuard,
          WebsocketService
      ],
      entryComponents: [
      ],
      bootstrap: [AppComponent]
  })
  export class AppModule { }
  </code></pre>
  
  <h2>login.module.ts</h2>
  
  <pre><code>import { NgModule } from '@angular/core';
  import { CommonModule } from '@angular/common';
  import { LoginComponent } from './login.component';
  import { loginRouting } from './login.routing';
  
  @NgModule({
      imports: [
          CommonModule,
          loginRouting
      ],
      declarations: [LoginComponent]
  })
  export class LoginModule { }
  </code></pre>
  
  <h2>login.routing.ts</h2>
  
  <pre><code>import { NgModule, ModuleWithProviders } from '@angular/core';
  import { Routes, RouterModule } from '@angular/router';
  import { LoginComponent } from './login.component';
  
  const routes: Routes = [
      { path: '', component: LoginComponent }
  ];
  
  export const loginRouting = RouterModule.forChild(routes);
  </code></pre>
  
  <h2>tsconfig.json</h2>
  
  <pre><code>{
      "compileOnSave": false,
      "compilerOptions": {
        "outDir": "./dist/out-tsc",
        "sourceMap": true,
        "declaration": false,
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "target": "es5",
        "typeRoots": [
          "node_modules/@types"
        ],
        "types": [
          "node"
        ],
        "lib": [
          "es2017",
          "dom"
        ],
        "baseUrl": "./src",
        "paths": {    
        },
        "module": "es2015"
      }
    }
  </code></pre>
  
  <h2>ng --version</h2>
  
  <pre><code>Angular CLI: 7.1.1
  Node: 10.13.0
  OS: win32 x64
  Angular: 7.1.1
  ... animations, cdk, cli, common, compiler, compiler-cli, core
  ... forms, http, language-service, material, platform-browser
  ... platform-browser-dynamic, platform-server, router
  ... service-worker
  
  Package                           Version
  -----------------------------------------------------------
  @angular-devkit/architect         0.10.7
  @angular-devkit/build-angular     0.10.7
  @angular-devkit/build-optimizer   0.10.7
  @angular-devkit/build-webpack     0.10.7
  @angular-devkit/core              7.0.7
  @angular-devkit/schematics        7.0.7
  @angular/pwa                      0.10.7
  @ngtools/webpack                  7.0.7
  @schematics/angular               7.0.7
  @schematics/update                0.11.1
  rxjs                              6.3.3
  typescript                        3.1.6
  webpack                           4.27.0
  </code></pre>