Angular routes not working on www directory

Question

I have the following routes on my app-routing.module.ts:

{
    path: '',
    redirectTo: 'login',
    pathMatch: 'full'
  },
  {
    path: 'login',
    loadChildren: () => import('./login/login.module').then( m => m.LoginPageModule)
  },
  {
    path: 'trace',
    loadChildren: () => import('./trace/trace.module').then( m => m.TracePageModule)
  },

accessing /trace works if I serve the app via ionic serve. However, when I build the app using ionic build --prod and serve www directory using an http server, browser returns 404.

I'd like to deploy this ionic app as a web app on firebase hosting.

Answer 1

You need to have the routing for your login and trace module also. Which would decide the further routing of the project.

and instead of loading modules like you mentioned, try to add the below lines to load the module login and trace.

const routes = [
{
    path: '',
    redirectTo: 'login',
    pathMatch: 'full'
  },
{path: 'login', loadChildren: './login/login.module#LoginModule'},
{path: 'trace', loadChildren: './trace/trace.module#TraceModule'}
]

I don't know the path of your login module. You please correct as per your path. and also define the routing file for the settings module also.