Antes de hacer esta pregunta, leí todas las preguntas similares en StackOverflow y probé todas las soluciones mencionadas por otros usuarios, pero sigo atascado en este problema aparentemente simple. Todo funciona bien en mi MacBook Air M1 local durante el desarrollo, pero después de producir la compilación de producción, no funciona en mi Windows Server 2019 Standard, que es mi servidor de producción. La siguiente es la versión simple de mi código fuente.
Módulo de aplicación:
import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { AppRoutingModule } from './app-routing.module'; import { AppComponent } from './app.component'; @NgModule({ declarations: [AppComponent], imports: [ BrowserModule, AppRoutingModule ], bootstrap: [AppComponent] }) export class AppModule {}Módulo de enrutamiento de aplicaciones:
import { NgModule } from "@angular/core"; import { RouterModule, Routes } from "@angular/router"; const routes: Routes = [ { path: "", pathMatch: "full", redirectTo: "/test" }, { path: "test", loadChildren: () => import("@project-name/test").then((m) => m.TestModule), }, ]; @NgModule({ imports: [RouterModule.forRoot(routes)], exports: [RouterModule], }) export class AppRoutingModule {}aplicación.componente.html:
<h1>I am app component!</h1> <router-outlet></router-outlet>Módulo de prueba:
import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { RouterModule } from '@angular/router'; import { TestComponent } from './test.component'; @NgModule({ imports: [CommonModule, RouterModule.forChild([{ path: '', component: TestComponent }])], declarations: [TestComponent] }) export class TestModule {}Componente de prueba:
<h1>I am a test component!</h1> En el servidor de producción, cuando localhost/my-project , el componente de prueba se cargará con éxito; pero cuando localhost/my-project/test , veo 404 Not Found y no se muestra nada en el navegador. Debo mencionar que he alojado la aplicación construida en nginx/1.19.10 y estoy desarrollando la aplicación usando Nx monorepo.
Lo que he intentado hasta ahora pero el problema aún no se ha resuelto:
esnextng build --prod --build-optimizer=false --aot=false comando y sección de configuración en angular.json