Nativescript Angular Navigation: Failed to find module relative to app://

Question

I’m trying to navigate to a new screen including tab navigation (in a new module) after successful login, but I’m getting the following error: Failed to find module: “./start/start.module”, relative to app://

It’s most likely related to a missing import, but I couldn’t figure out the problem yet. I’ve read through some Github issues, but their suggestions failed me so far.

Has anyone else encountered this before? (some of the code below)

You can also look into a structure fairly similar to what I'm trying to achieve in this link. There's currently an issue in the playground but I'm looking into it (Error: Cannot match any routes. URL Segment: 'profile')

Thanks

// app-routing.module.ts

(...)
const routes: Routes = [
  { path: "", redirectTo: "/login", pathMatch: "full" },
  { path: "login", component: LoginComponent },
  { path: "start", loadChildren: "./start/start.module#StartModule" }
];

// login.component.ts

login() {
  (...)
  this.router.navigate(["/start"]);
}

// start-routing.module.ts

const routes: Routes = [
  {
    path: "",
    redirectTo: "/(homeTab:home//browseTab:browse//searchTab:search)",
    pathMatch: "full"
  },

  { path: "home", component: HomeComponent, outlet: "homeTab" },
  { path: "browse", component: BrowseComponent, outlet: "browseTab" },
  { path: "search", component: SearchComponent, outlet: "searchTab" },

  { path: "item/:id", component: ItemDetailComponent, outlet: "homeTab" }
];

@NgModule({
  imports: [NativeScriptRouterModule.forRoot(routes)],
  exports: [NativeScriptRouterModule]
})
export class StartRoutingModule {}

// start.module.ts

import { StartRoutingModule } from "./start-routing.module";

@NgModule({
  imports: [
    NativeScriptModule,
    NativeScriptCommonModule,
    StartRoutingModule
  ],
  declarations: [
    BrowseComponent,
    HomeComponent,
    ItemDetailComponent,
    SearchComponent,
    StartComponent
  ],
  exports: [
    StartRoutingModule
  ],
  schemas: [NO_ERRORS_SCHEMA]
})
export class StartModule {}

Answer 1

There is a open feature request to support multiple scenarios using nested router outlets, hope it will be ready with NativeScript 5.0 & Angular 6.2.0