Router/lazy sistema manual

cuando cree el proyecto le digoq eu si mi proyecto tendra ruta

crea el modulo de rutas de manera manual en la base del proyecto

para hacer de manera manual coloco el comando 

ng g m auth

me crea un modulo llamado auth

 ahora ese modulo lo llevo al modulo raiz

creo componentes dentro de las paginas dentro del modulo auth

para ello 

ng g c auth/pages/registro

ng g c auth/pages/login

ng g c auth/pages/forgot

se crearán tres componentes dentro de una carpeta pages, dentro del modulo auth

ahora creo un sistema de ruta interna del modulo auth

con el  comando 

ng g m auth/authRouting --flat

esto me creará una modelo ruta dentro del modelo auth

coloco 

dentro del modulo 

import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [];

ahora creo las rutas para cadea componente

const routes: Routes = [

  {

    path:"", //lo dejo vacio pues vendrá definido del padre

    children:[

      {

        //coloco la dirección de la pagina hija y el componente

        //que referencia

        path:"forgot", component:FotgotComponent

      },

      {

        path:"login", component:LoginComponent

      },

      {

        path:"registro", component:RegistroComponent

      },

      {

        // si no se especifica sub ruta demanera automatca cargará login

        path:"**", redirectTo: "login"

      }

    ]

  }

ahora importo el forChild

@NgModule({

  imports: [RouterModule.forChild(routes)],

  exports: [RouterModule]

})

importo el siste de rutas de autj en el aut module

//modulos de ruta interna dentro del modulo

import { AuthRoutingModule } from './auth-routing.module';

import { CommonModule } from '@angular/common';

import { NgModule } from '@angular/core';

// componentes que dependen del modulo

import { FotgotComponent } from './pages/fotgot/fotgot.component';

import { LoginComponent } from './pages/login/login.component';

import { RegistroComponent } from './pages/registro/registro.component';

@NgModule({

  declarations: [

    RegistroComponent,

    LoginComponent,

    FotgotComponent

  ],

  imports: [

    CommonModule,

    AuthRoutingModule

  ]

})

export class AuthModule { }

ahora en el sistema de ruta principal debo crear la ruta para este modulo con carga

carga peresoza

import { NgModule } from '@angular/core';

import { RouterModule, Routes } from '@angular/router';

const routes: Routes = [

  {

    path:"auth",

    // cuando sea llamado se ejecutará la carga

    // le estoy diciendo importame este medulo si es requerido

    //esta es una gfunción que retorna una promesa

    loadChildren: () => import('./auth/auth.module').then(m=>m.AuthModule)

  //la promesa trae el modulo que llamamos m y estratemos si valor

  // con m.authModule

  },

  {// sino coloca nada se va a redirigir por defecto a auth

    path:"**", redirectTo:"auth"

  }

];

@NgModule({

  imports: [RouterModule.forRoot(routes)],

  exports: [RouterModule]

})

export class AppRoutingModule { }

ahora en el html debo colocar el router link

<ul>

  <li>

    <a routerLink="auth/login">Login</a>

  </li>

  <li>

    <a routerLink="auth/registro">Registro</a>

  </li>

  <li>

    <a routerLink="auth/forgot">forgot</a>

  </li>

</ul>

<router-outlet></router-outlet>