Login to tabs routing issue

Ionic Framework Ionic Angular
1

I’m having issues with routing and tabs. Whenever the default loaded page is login, it won’t route to tabs, and it says it doesn’t exist. But when I load tabs first and then go to login, everything works fine.
I’m using Firebase for the database

I get the error

chunk-LA7NJQBU.js:7 ERROR FirebaseError: Firebase: No Firebase App ‘[DEFAULT]’ has been created - call initializeApp() first (app/no-app).

app.route.ts

import { Routes } from '@angular/router';

export const routes: Routes = [
  // {
  //   path: '',
  //   loadComponent: () => import('./login/login.page').then(m => m.LoginPage), 
  // },
  // {
  //   path: 'login-success',
  //   redirectTo: '/tabs',
  //   pathMatch: 'full',
  // },
  {
    path: '',
    loadChildren: () => import('./tabs/tabs.routes').then((m) => m.routes), 
    
  },
  {
    path: 'login',
    loadComponent: () => import('./login/login.page').then(m => m.LoginPage),
    
  },
  {
    path: 'register',
    loadComponent: () => import('./register/register.page').then(m => m.RegisterPage),
  },
  {
    path: 'tabs',
    loadChildren: () => import('./tabs/tabs.routes').then((m) => m.routes), 
  },
];

tabs.route.ts

import { Routes } from '@angular/router';
import { TabsPage } from './tabs.page';

export const routes: Routes = [
  {
    path: 'tabs',
    component: TabsPage,
    children: [
      {
        path: 'tab1',
        loadComponent: () =>
          import('../tab1/tab1.page').then((m) => m.Tab1Page),
      },
      {
        path: 'tab2',
        loadComponent: () =>
          import('../tab2/tab2.page').then((m) => m.Tab2Page),
      },
      {
        path: 'tab3',
        loadComponent: () =>
          import('../tab3/tab3.page').then((m) => m.Tab3Page),
      },
      {
        path: '',
        redirectTo: '/tabs/tab1',
        pathMatch: 'full',
      },
    ],
  },
  {
    path: '',
    redirectTo: '/tabs/tab1',
    pathMatch: 'full',
  },
];

login function
signInWithEmailAndPassword(this.oAuth, this.gEmail, this.gPassword)
.then((userCredential) => {
const user = userCredential.user;
console.log(user);
// this.router.navigateByUrl(‘login-success’);
// this.router.navigateByUrl(‘/tabs/tab1’);
this.router.navigateByUrl(‘/tabs’);

2

It would seem this is your issue. If JS is throwing an error then your app is probably halting execution and thus not navigating as expected.

Look at where you are initializing Firebase and adjust your code so you don’t get the error.

3

i don’t think its the firebase initializing because if i were to, change the ’ ’ path in app. route.ts to what is comment out it is when I get the error but as it is it works fine.