1
resposta

Rotas lazy loading não sendo carregadas após login

Em uma aplicação eu estou com um problema que é :

quando realizo o login com sucesso, eu sou redirecionado para uma rota chamada 'dashboard', mas a partir daí quando tento acessar qualquer módulo preguiçoso, esse módulo não é carregado, nenhum erro ocorre, a url muda tranquilamente o atributo do title também muda tranquilamente, mas o componente não é carregado na tela. Tudo volta ao normal se eu recarregar a pagina (f5), aí eu consigo acessar os módulos preguiçosos.

Resumindo : Quando eu logo na aplicação, se eu clicar em qualquer link que me leve a uma rota que carrega um módulo preguiçoso, o mesmo não é carregado.

Outras informações :

Nenhum erro ocorre no console, e quando eu tento acessar acessar esses modulos preguiçosos na aba network nenhuma requisição é feita para o chunck

Os chunks estão sendo gerados perfeitamente

Abaixo meu arquivo de rotas principal :

export const routes: Routes = [
    {
        path: 'dashboard',
        component: SistemaComponent,
        canActivate: [SistemaLiberadoGuard,
            SistemaGuard],
            data: {
                title: 'dashboard'
            }
        },
        {
            path: 'login',
            component: S4LoginComponent,
            canActivate: [ LoginGuard ],
            data: {
                title: 'login'
            }
        },
        {
            path: 'usuarios',
            loadChildren: './usuario-perfil-permissoes/usuario-perfil-permissoes.module#UsuarioPerfilPermissoesModule'
        },
        {
            path: 'liberacaosistema',
            loadChildren: './liberacao-sistema/liberacao-sistema.module#LiberacaoSistemaModule',
        },
        {
            path: 'profileusuario',
            loadChildren: './profile/profile.module#ProfileModule',
        },
        {
            path: '',
            pathMatch: 'full',
            redirectTo: 'dashboard'
        },
        {
            path: '**',
            component: S4NotFoundComponent,
            data: {
                title: 'Page Not Found'
            }
        }

    ]
    @NgModule({
        imports: [
            RouterModule.forRoot(routes, { useHash: true })
        ],
        exports: [RouterModule]
    })
export class AppRoutingModule {
}

Abaixo o arquivo de rotas de um dos módulos que estão sendo carregados preguiçosamentes

export const routes: Routes = [
  {
      path: '',
      component: ProfileComponent,
      canActivate: [SistemaGuard],
      data: {
            title: 'Profile'
      }
  }
]

@NgModule({
    imports: [
        RouterModule.forChild(routes)
    ],
    exports: [RouterModule]
})
export class ProfileRoutingModule {
}

Não estou sabendo como debugar esse problema, qualquer ajuda é bem-vinda .

1 resposta

Fala ai Lúcio, tudo bem? Olhando por cima os códigos, parecem estar corretos, mas, pode ser que tenha algum detalhe que a olho eu não consegui pegar.

Consegue compartilhar o projeto comigo? Assim eu consigo simular e verificar na minha maquina, ajudaria bastante.

Fico no aguardo.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software