El checklist de migración a Standalone que evita los errores que bloquean el equipo

¿Qué significa standalone en Angular?

Un componente standalone se declara a sí mismo: no necesita pertenecer a ningún NgModule para funcionar. Sus dependencias (otros componentes, directivas, pipes) se importan directamente en el decorador @Component. El resultado es un componente autocontenido que puedes mover, testear y cargar de forma lazy sin arrastrar un módulo entero.

@Component({
  selector: 'app-profile',
  standalone: true,
  imports: [CommonModule, RouterLink, AvatarComponent],
  template: `...`,
})
export class ProfileComponent {}

NgModules vs Standalone: las diferencias clave

• Declaración de dependencias: Con NgModules las dependencias se declaran en el módulo y están disponibles para todos sus componentes — invisible y difícil de trazar. Con standalone, cada componente declara exactamente lo que usa en su propio imports[].
• Lazy loading: Antes necesitabas un NgModule para hacer lazy loading de una ruta. Con standalone, loadComponent apunta directamente al componente. Menos archivos, mismo resultado.
• Testing: Los tests de componentes standalone son más simples: no hay que montar un TestingModule con todas las dependencias del módulo. Solo importas lo que el componente necesita.
• Boilerplate: Un módulo típico tiene declarations, imports, exports y providers. Un componente standalone elimina ese archivo por completo. En apps de 50+ componentes la diferencia es notable.

Las tres fases de la migración

• Fase 1 — Componentes leaf (hojas): Empieza por los componentes que no declaran a nadie: presentacionales, dumb components, pipes. Son los más fáciles de convertir y los que no arrastran dependencias hacia arriba. Usa ng generate @angular/core:standalone --path src/app/shared.
• Fase 2 — Módulos compartidos (SharedModule, CoreModule): Una vez que los componentes que exportaban ya son standalone, convierte los SharedModules. Su exports[] ahora es un array de componentes standalone que otros pueden importar directamente.
• Fase 3 — AppModule y módulos de ruta: El paso final. Convierte AppModule a bootstrapApplication() con provideRouter(), provideHttpClient() y el resto de providers. Los módulos de ruta se convierten en arrays de Routes exportados.

Lo que el CLI no migra automáticamente

• forRoot() y forChild() de librerías de terceros: RouterModule.forRoot() se convierte en provideRouter(). HttpClientModule en provideHttpClient(). Pero librerías externas que usan forRoot() propietario necesitan revisión manual — busca su guía de migración standalone.
• Providers en NgModules de feature: Los providers declarados en un NgModule de feature pasan a ir en la ruta (providers[] de la Route) o en el bootstrapApplication. El CLI los mueve, pero hay que verificar que el scope sea el correcto.
• CUSTOM_ELEMENTS_SCHEMA y NO_ERRORS_SCHEMA: Si usabas estos schemas en un módulo para silenciar errores de elementos desconocidos, tendrás que añadirlos explícitamente en cada componente standalone que los necesite — o mejor, resolver la causa raíz.
• Tests que montan NgModules: Los tests existentes que usan TestBed.configureTestingModule con declarations[] seguirán funcionando, pero los nuevos tests de componentes standalone son más limpios con imports[] directo.

Checklist antes de hacer merge

• ¿Todos los lazy chunks siguen cargando?: Navega a cada ruta lazy en el navegador con Network tab abierto. Verifica que el chunk se descarga solo cuando corresponde y que no hay errores 404.
• ¿Los guards y resolvers siguen funcionando?: Los guards funcionales no cambian, pero si tenías class-based guards en el módulo de ruta, verifica que están registrados en el providers[] de la Route o en provideRouter().
• ¿El árbol de providers tiene el scope correcto?: Un provider que estaba en un NgModule de feature era singleton dentro de ese módulo. Al moverlo a root podría convertirse en un singleton global. Revisa los servicios con estado.
• ¿Los tests pasan en CI?: No solo en local. Las diferencias de entorno en el module resolution pueden ocultar imports que faltan hasta que CI los detecta con zona horaria diferente o sin caché.