Búsqueda de sitios web

angular - 'No se pudo resolver el módulo... relativo a...' Error al compilar la aplicación


Cuando compilo mi aplicación ionic 4, obtengo este error: ERROR in Could not resolve module ./services/services.module relative to app/app-routing.module.ts y la simulación no se inicia. Sin embargo, si cambio algo en mi código y vuelvo a compilar, el código se compila correctamente. He investigado y probablemente tiene que ver con las rutas (absolutas/relativas). Pero en estas preguntas la solución era usar rutas relativas https://github.com/angular/angular-cli/issues/8641 o en esta pregunta Angular 4 - Could not resolve submodule for routing. Dado que ya estoy usando rutas relativas, no sé qué hacer. La estructura de carpetas en esta aplicación es => src/app/pages o services. EDIT: El problema incluso sigue ocurriendo cuando elimino toda la carpeta de servicios con todas las conexiones.

router.module.ts

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

    import { TabsPage } from './tabs.page';

    const routes: Routes = [
      {
        path: 'tabs',
        component: TabsPage,
        children: [
          {
            path: 'one',
            children: [
              {
                path: '',
                loadChildren: '../one/one.module#OnePageModule'
              }
            ]
          },
          {
            path: 'two',
            children: [
              {
                path: '',
                loadChildren: '../two/two.module#TwoPageModule'
              }
            ]
          },
          {
            path: 'three',
            children: [
              {
                path: '',
                loadChildren: '../three/three.module#ThreePageModule'
              }
            ]
          },
          {
            path: 'four',
            children: [
              {
                path: '',
                loadChildren: '../four/four.module#FourPageModule'
              }
            ]
          },

          {
            path: 'five',
            children: [
              {
                path: '',
                loadChildren: '../five/five.module#FivePageModule'
              }
            ]
          },

          {
            path: '',
            redirectTo: '/tabs/one',
            pathMatch: 'full'
          }
        ]
      },
      {
        path: '',
        redirectTo: '/tabs/one',
        pathMatch: 'full'
      }
    ];

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

app-routing.module.ts

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

const routes: Routes = [
  { path: '', loadChildren: './tabs/tabs.module#TabsPageModule' },
  { path: 'one', loadChildren: './one/one.module#OnePageModule' },
  { path: 'filter', loadChildren: './filter/filter.module#FilterPageModule' },
  { path: 'four', loadChildren: './four/four.module#FourPageModule' },
  { path: 'key', loadChildren: './key/key.module#KeyPageModule' },
  { path: 'test', loadChildren: './test/test.module#TestPageModule' },
  { path: 'notifications', loadChildren: './notifications/notifications.module#NotificationsPageModule' },
  { path: 'three', loadChildren: './three/three.module#ThreePageModule' },
  { path: 'five', loadChildren: './five/five.module#FivePageModule' },
  { path: 'two', loadChildren: './two/two.module#TwoPageModule' },
  { path: 'services', loadChildren: './services/services.module#ServicesPageModule' },
  { path: 'settings', loadChildren: './settings/settings.module#SettingsPageModule' },
  { path: 'login', loadChildren: './login/login.module#LoginPageModule' },
  { path: 'signup', loadChildren: './signup/signup.module#SignupPageModule' },
  { path: 'friprofile', loadChildren: './friprofile/friprofile.module#FriprofilePageModule' },
  { path: 'four/:id', loadChildren: './four-details/four-details.module#FourDetailsPageModule' },   
  { path: 'two-details', loadChildren: './two-details/two-details.module#TwoDetailsPageModule' },
  { path: 'choose', loadChildren: './choose/choose.module#ChoosePageModule' },
  { path: 'camfilter', loadChildren: './camfilter/camfilter.module#CamfilterPageModule' }
//Changed from four-details -> four/:id
];
@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})
export class AppRoutingModule {}

Respuesta #1

Basado en la información que ha proporcionado, puedo ver que el módulo al que se refieren los mensajes de error (ServiceModule) no parece incorrecto:

{ path: 'services', loadChildren: './services/services.module#ServicesPageModule' },

Esto significa que es una de dos cosas:

  1. ese archivo no existe: mira en tus directorios y confirma que /services/services.module.ts existe
  2. has renombrado el archivo en algún momento pero no has renombrado el código dentro; verifica que haya un export class ServicesPageModule {} dentro del archivo /services/services.module.ts

(Actualización) ¿Qué es un servicio?

Siguiendo tus comentarios, parece que no sabes lo que es la página de servicio en tu proyecto.

Un Servicio de Angular es una clase que puedes inyectar en componentes para que puedas reutilizar y compartir lógica/datos entre partes de la aplicación y hacer cumplir una separación limpia de responsabilidades.

Eso no es de lo que estamos hablando aquí.

Según tu archivo de enrutamiento, en algún momento, has generado una página llamada servicios. ¿O simplemente pusiste esa línea ahí tú mismo?

Si no tienes una página de servicios, entonces esta línea no debería estar allí, así que simplemente elimínala.

Si tienes una página de servicios, entonces necesita coincidir con la ruta y el nombre del módulo, como he explicado arriba.