Querida Comunidad.
Tengo el siguiente problema.
Estuve desarrollando lo mas bien, hasta que quise subir el proyecto de angular a mi servidor, hice el ng build
, pero no lograba ingresar a la página de inicio. Entonces comencé a jugar con el <base href="/">
del index.html y compilaba una y otra vez, además de no lograr que funcione bien en producción, ahora en desarrollo, cuando ejecuto ng serve
a la pagina de inicio le agrega un #
si bien, dicha página se muestra, al querer dirigirme a otra ruta, no la muestra, porque obviamente la direcciona sin el #
.
Si voy al home, se muestra de la siguiente manera:
http://localhost:4200/#/
¿Alguna ayuda para que esto no suceda?
¿Qué archivo del proyecto debería compartirles para buscar la solución?
Mientras tanto, comparto el index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Cens15</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>
app-routing.module.ts
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{
path:'home',
loadChildren:()=>import('./pages/home/home.module').then(m=>m.HomeModule)
}
,
{
path:'users',
loadChildren:()=>import('./pages/users/users.module').then(m=>m.UsersModule)
},
{
path:'alumnos',
loadChildren:()=>import('./pages/alumnos/alumnos.module').then(m=>m.AlumnosModule)
},
{
path:'cursos',
loadChildren:()=>import('./pages/cursos/cursos.module').then(m=>m.CursosModule)
},
{
path:'materias',
loadChildren:()=>import('./pages/materias/materias.module').then(m=>m.MateriasModule)
},
{
path:'**',
redirectTo:'home'
},
]
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
Lo curioso es que en otro trabajo que tengo, lo hice de la misma forma (y lo hago, porque subo actualizaciones) y no estoy teniendo este problema. Espero que puedan ayudarme. Un saludos.