# How to solve Error: cannot find module in Ionic 4 (tabs navigation post login)

**URL:** <https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110>\
**Category:** Ionic Framework\
**Created:** [April 21, 2019, 4:53am UTC](https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110 "2019-04-21T04:53:41Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![lily28](https://avatars.discourse-cdn.com/v4/letter/l/f9ae1b/32.png) [@lily28](https://forum.ionicframework.com/u/lily28)\
**Post date:** [April 21, 2019, 4:53am UTC](https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110/1 "2019-04-21T04:53:41Z")

</div>

Hey, I’m new to ionic and currently doing my project. Tabs worked fine at first but I got an error after trying to navigate it after login. Not sure what i’m doing wrong 😔 any help would be appreciated, thanks.

Error  
ERROR Error: Uncaught (in promise): Error: Cannot find module ‘…/pages/tab1/tab1.module’  
Error: Cannot find module ‘…/pages/tab1/tab1.module’  
at $\_lazy\_route\_resource lazy namespace object:35  
at ZoneDelegate.push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:391)  
at Object.onInvoke (core.js:17299)  
at ZoneDelegate.push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:390)  
at Zone.push…/node\_modules/zone.js/dist/zone.js.Zone.run (zone.js:150)  
at zone.js:889  
at ZoneDelegate.push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)  
at Object.onInvokeTask (core.js:17290)  
at ZoneDelegate.push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)  
at Zone.push…/node\_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)  
at resolvePromise (zone.js:831)  
at resolvePromise (zone.js:788)  
at zone.js:892  
at ZoneDelegate.push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)  
at Object.onInvokeTask (core.js:17290)  
at ZoneDelegate.push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)  
at Zone.push…/node\_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)  
at drainMicroTaskQueue (zone.js:601)  
defaultErrorLogger @ core.js:15724  
push…/node\_modules/@angular/core/fesm5/core.js.ErrorHandler.handleError @ core.js:15772  
next @ core.js:17771  
schedulerFn @ core.js:13515  
push…/node\_modules/rxjs/\_esm5/internal/Subscriber.js.SafeSubscriber.\_\_tryOrUnsub @ Subscriber.js:196  
push…/node\_modules/rxjs/\_esm5/internal/Subscriber.js.SafeSubscriber.next @ Subscriber.js:134  
push…/node\_modules/rxjs/\_esm5/internal/Subscriber.js.Subscriber.\_next @ Subscriber.js:77  
push…/node\_modules/rxjs/\_esm5/internal/Subscriber.js.Subscriber.next @ Subscriber.js:54  
push…/node\_modules/rxjs/\_esm5/internal/Subject.js.Subject.next @ Subject.js:47  
push…/node\_modules/@angular/core/fesm5/core.js.EventEmitter.emit @ core.js:13499  
(anonymous) @ core.js:17321  
push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.invoke @ zone.js:391  
push…/node\_modules/zone.js/dist/zone.js.Zone.run @ zone.js:150  
push…/node\_modules/@angular/core/fesm5/core.js.NgZone.runOutsideAngular @ core.js:17258  
onHandleError @ core.js:17321  
push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.handleError @ zone.js:395  
push…/node\_modules/zone.js/dist/zone.js.Zone.runGuarded @ zone.js:164  
\_loop\_1 @ zone.js:694  
api.microtaskDrainDone @ zone.js:703  
drainMicroTaskQueue @ zone.js:608  
Promise.then (async)  
scheduleMicroTask @ zone.js:584  
push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:413  
onScheduleTask @ zone.js:301  
push…/node\_modules/zone.js/dist/zone.js.ZoneDelegate.scheduleTask @ zone.js:404  
push…/node\_modules/zone.js/dist/zone.js.Zone.scheduleTask @ zone.js:238  
push…/node\_modules/zone.js/dist/zone.js.Zone.scheduleMicroTask @ zone.js:258  
scheduleResolveOrReject @ zone.js:879  
resolvePromise @ zone.js:825  
(anonymous) @ zone.js:741  
webpackJsonpCallback @ bootstrap:25  
(anonymous) @ pages-tabs-tabs-module.js:1

**app-routing.module.ts**  
import { NgModule } from ‘@angular/core’;  
import { RouterModule, Routes } from ‘@angular/router’;

const routes: Routes = [  
{ path: ‘’, redirectTo: ‘tabs’, pathMatch: ‘full’ },  
{ path: ‘login’, loadChildren: ‘./login/login.module#LoginPageModule’ },  
{ path: ‘register’, loadChildren: ‘./register/register.module#RegisterPageModule’ },  
{ path: ‘tabs’, loadChildren: ‘./pages/tabs/tabs.module#TabsPageModule’ },  
{ path: ‘childdetails’, loadChildren: ‘./pages.childdetails.module#ChilddetailsPageModule’ },  
];

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

**tabs.router.module.ts**  
import { RouterModule, Routes} from ‘@angular/router’;  
import { NgModule } from ‘@angular/core’;  
import { TabsPage } from ‘./tabs.page’;

const routes: Routes = [  
{  
path: ‘’, //default  
component: TabsPage, [//localhost/tabs/](https://localhost/tabs/)…  
children: [  
{ path: ‘tab1’, loadChildren: ‘…/pages/tab1/tab1.module#Tab1PageModule’ },  
{ path: ‘tab2’, loadChildren: ‘…/pages/tab2/tab2.module#Tab2PageModule’ },  
{ path: ‘tab3’, loadChildren: ‘…/pages/tab3/tab3.module#Tab3PageModule’ },  
]

```
},

```

];

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

**tabs.module.ts**  
import { NgModule } from ‘@angular/core’;  
import { CommonModule } from ‘@angular/common’;  
import { FormsModule } from ‘@angular/forms’;

import { IonicModule } from ‘@ionic/angular’;

import { TabsPage } from ‘./tabs.page’;  
import { TabsRoutingModule } from ‘./tabs.router.module’;

@NgModule({  
imports: [  
CommonModule,  
FormsModule,  
IonicModule,  
TabsRoutingModule  
],  
declarations: [TabsPage]  
})  
export class TabsPageModule {}

other code, here is the repo [https://github.com/Lilly08/Llly](https://github.com/Lilly08/Llly)

---

<div class="post-metadata">

**Author:** ![AdamGelineau](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/adamgelineau/32/123043_2.png) [@AdamGelineau](https://forum.ionicframework.com/u/AdamGelineau)\
**Post date:** [June 12, 2019, 2:38pm UTC](https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110/2 "2019-06-12T14:38:05Z")

</div>

> [@lily28](#):
>
> loadChildren: ‘…/pages/tab1/tab1.module#Tab1PageModule’

For your routes, try like this:

```auto
loadChildren: ‘../tab1/tab1.module#Tab1PageModule’

```

Or:

```auto
loadChildren: ‘../pages/tab1/tab1.module#Tab1PageModule’

```

Personnaly, in my app, it’s like this:

```auto
loadChildren: ‘./tab1/tab1.module#Tab1PageModule’

```

---

<div class="post-metadata">

**Author:** ![Rohityadav0606](https://avatars.discourse-cdn.com/v4/letter/r/71e660/32.png) [@Rohityadav0606](https://forum.ionicframework.com/u/Rohityadav0606)\
**Post date:** [October 16, 2019, 7:39am UTC](https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110/3 "2019-10-16T07:39:45Z")

</div>

here is the solution  
I have been facing same problem and found the right solution

in tabs.module.ts file

add this

const routes: Routes = [  
{  
path: ‘’,  
component: TabsPage,  
children: [  
{path: ‘tab1’, component:Tab1Page },  
{ path: ‘tab2’, component:Tab2Page },  
{ path: ‘tab3’, component:Tab3Page },  
{  
path: ‘’,  
redirectTo: ‘/tabs/tab1’,  
pathMatch: ‘full’  
}  
]  
},  
{  
path: ‘’,  
redirectTo: ‘/tabs/tab1’,  
pathMatch: ‘full’  
}  
];

@NgModule({  
declarations: [TabsPage,Tab1Page,Tab2Page  
,Tab3Page]  
})

it is working fine

---

<div class="post-metadata">

**Author:** ![anateixeira](https://avatars.discourse-cdn.com/v4/letter/a/35a633/32.png) [@anateixeira](https://forum.ionicframework.com/u/anateixeira)\
**Post date:** [February 18, 2020, 10:08am UTC](https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110/4 "2020-02-18T10:08:38Z")

</div>

Thank you so much you solved my problem 😃

---

<div class="post-metadata">

**Author:** ![gerhartz](https://avatars.discourse-cdn.com/v4/letter/g/a8b319/32.png) [@gerhartz](https://forum.ionicframework.com/u/gerhartz)\
**Post date:** [January 18, 2021, 4:01pm UTC](https://forum.ionicframework.com/t/how-to-solve-error-cannot-find-module-in-ionic-4-tabs-navigation-post-login/162110/5 "2021-01-18T16:01:41Z")

</div>

I’m having a similar issue with a sub-tab not being displayed but I’m getting strange behavior at runtime. The first load after running `ionic serve` will display

```auto
ERROR Error: Uncaught (in promise): Error: Cannot find module ‘../tab1/detail/detail.module'
Error: Cannot find module ‘../tab1/detail/detail.module’ 

```

But if I navigate to the tabs.routing.ts file and delete the path, save and then add the same exact path back and save the app will compile and run and navigate correctly. It literally just requires me to delete/un-delete the path and will run the 2nd time without any changes.

Obviously I don’t want to have to make an edit at runtime to get it to work. Does anyone know what the issue might be causing this?