How to use the @ngrx/router-store.StoreRouterConnectingModule.forRoot function in @ngrx/router-store

NoEndpointsNonAdminComponent,
  ],
  imports: [
    EntityCatalogueModule.forFeature(generateStratosEntities),
    RouteModule,
    CloudFoundryPackageModule,
    AppStoreModule,
    BrowserModule,
    SharedModule,
    BrowserAnimationsModule,
    CoreModule,
    SetupModule,
    LoginModule,
    HomeModule,
    DashboardModule,
    StoreRouterConnectingModule.forRoot(), // Create action for router navigation
    AboutModule,
    CustomImportModule,
    XSRFModule,
    CfAutoscalerModule
  ],
  providers: [
    CustomizationService,
    TabNavService,
    LoggedInService,
    ExtensionService,
    DynamicExtensionRoutes,
    { provide: GITHUB_API_URL, useFactory: getGitHubAPIURL },
    { provide: RouterStateSerializer, useClass: CustomRouterStateSerializer }, // Create action for router navigation
    { provide: RouteReuseStrategy, useClass: CustomReuseStrategy }
  ],
  bootstrap: [AppComponent]

path: '',
		runGuardsAndResolvers: 'always',
	},
];

/**
 * Marks an class as an NgModule so it could be configured
 */
@NgModule({
	exports: [RouterModule],
	imports: [
		RouterModule.forRoot(appRoutes, {
			enableTracing: false,
			onSameUrlNavigation: 'reload',
		}),
		StoreRouterConnectingModule.forRoot({
			serializer: CustomSerializer,
		}),
	],
	providers: [{ provide: RouterStateSerializer, useClass: CustomSerializer }],
})

/* istanbul ignore next */
/**
 * Exports the AppRoutingModule from the NgModule
 */
export class AppRoutingModule {}

ReactiveFormsModule,
    HttpClientModule,
    MarkdownModule.forRoot({ loader: HttpClient }),
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: HttpLoaderFactory,
        deps: [HttpClient]
      }
    }),
    StoreModule.forRoot({
      router: routerReducer,
      users: usersReducer
    }),
    // Connects RouterModule with StoreModule
    StoreRouterConnectingModule.forRoot({
      stateKey: "router" // name of reducer key
    }),
    StoreDevtoolsModule.instrument({
      maxAge: 25, // Retains last 25 states
      logOnly: environment.production // Restrict extension to log-only mode
    }),
    EffectsModule.forRoot([UserEffects])
  ],
  providers: [
    UserService,
    AuthService,
    GroupService,
    TextService,
    VoteService,
    AuthenticationGuard
  ],

import {TransferHttpCacheModule} from '@nguniversal/common';
import { ProfileModule } from './profile/profile.module';
import { AboutModule } from './about/about.module';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSnackBarModule } from '@angular/material/snack-bar';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    RouterModule.forRoot(appRoutes),
    StoreModule.forRoot(reducers, { metaReducers }),
    EffectsModule.forRoot(effects),
    // Connects RouterModule with StoreModule
    StoreRouterConnectingModule.forRoot({
      stateKey: 'router', // name of reducer key
    }),
    StoreDevtoolsModule.instrument({
      maxAge: 25, // Retains last 25 states
      logOnly: environment.production, // Restrict extension to log-only mode
    }),
    BrowserModule.withServerTransition({appId: 'my-app'}),
    TransferHttpCacheModule,
    FormsModule,
    ReactiveFormsModule,
    BrowserAnimationsModule,
    MatProgressSpinnerModule,
    NavbarModule,
    HomeModule,
    ProfileModule,
    AuthenticationModule,

import { CustomSerializer } from "./shared/utils";

import { AppRoutingModule } from "./app-routing.module";

import { AppComponent } from "./app.component";
import { HomeComponent } from "./home/home.component";
import { NavbarComponent } from "./navbar/navbar.component";

@NgModule({
  declarations: [AppComponent, HomeComponent, NavbarComponent],
  imports: [
    BrowserModule,
    StoreModule.forRoot({
      router: routerReducer
    }),
    StoreRouterConnectingModule.forRoot({ stateKey: "router" }),
    StoreDevtoolsModule.instrument(),
    EffectsModule.forRoot([]),
    HttpClientModule,
    AppRoutingModule
  ],
  providers: [{ provide: RouterStateSerializer, useClass: CustomSerializer }],
  bootstrap: [AppComponent]
})
export class AppModule {}

ProductsModule,
    LayoutModule,
    CartModule,
    StoreModule.forRoot(
      {},
      {
        metaReducers: !environment.production ? [] : [],
        runtimeChecks: {
          strictStateImmutability: true,
          strictActionImmutability: true
        }
      }
    ),
    EffectsModule.forRoot([]),
    !environment.production ? StoreDevtoolsModule.instrument() : [],
    StoreRouterConnectingModule.forRoot({
      routerState: RouterState.Minimal
    })
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

AppEffects,
  NodeEffects,
  DownloadEffects,
  ViewerEffects,
  SearchEffects,
  LibraryEffects,
  UploadEffects,
  FavoriteEffects,
  TemplateEffects
} from './effects';
import { INITIAL_STATE } from './initial-state';

@NgModule({
  imports: [
    StoreModule.forRoot({ app: appReducer }, { initialState: INITIAL_STATE }),
    StoreRouterConnectingModule.forRoot({ stateKey: 'router' }),
    SharedStoreModule,
    EffectsModule.forRoot([
      AppEffects,
      NodeEffects,
      DownloadEffects,
      ViewerEffects,
      SearchEffects,
      LibraryEffects,
      UploadEffects,
      FavoriteEffects,
      TemplateEffects
    ]),
    !environment.production
      ? StoreDevtoolsModule.instrument({ maxAge: 25 })
      : []
  ]

import { AuthEffects } from './store/effects/auth.effects';
import { rootReducers } from './store/reducers/reducers';
import { INITIAL_STATE } from './store/states/app.state';
import { metaReducers } from './store/reducers/meta.reducers';

@NgModule({
    imports: [
        StoreModule.forRoot(rootReducers, { initialState: INITIAL_STATE, metaReducers: metaReducers }),
        EffectsModule.forRoot([
            AuthEffects,
            SnackbarEffects,
            DialogEffects,
            SettingsEffects,
            UiEffects
        ]),
        StoreRouterConnectingModule.forRoot({ stateKey: 'router' }),
        !environment.production ? StoreDevtoolsModule.instrument({ maxAge: 25 }) : []
    ],
    providers: [{ provide: RouterStateSerializer, useClass: AmaRouterStateSerializer }]
})
export class AppStoreModule {}

const reducers = {
  router: routerReducer,
  navMenu: navMenuReducer,
};

const EFFECTS = [IdleEffects, NotificationsEffects];

@NgModule({
  imports: [
    ConfigStoreModule,
    LayoutStoreModule,
    UserTagsStoreModule,
    StoreModule.forRoot(reducers, { metaReducers }),
    EffectsModule.forRoot(EFFECTS),
    StoreRouterConnectingModule.forRoot({
      stateKey: 'router',
    }),
    environment.production ? [] : StoreDevtoolsModule.instrument({ maxAge: 30 }),
  ],
  providers: [{ provide: RouterStateSerializer, useClass: CustomRouterStateSerializer }],
})
export class RootStoreModule {}

UserStatsCardComponent,
    AchievementsComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    LazyLoadImagesModule,
    CookieLawModule,

    EffectsModule.forRoot([]),
    StoreModule.forRoot(reducers),
    StoreDevtoolsModule.instrument({
      maxAge: 20
    }),
    //StoreModule.forRoot(reducers),
    StoreRouterConnectingModule.forRoot(),

    //rwa modules
    CoreModule,
    SharedModule,
    RoutingModule,
    BrowserModule.withServerTransition({ appId: 'trivia' }),
    //BrowserTransferStateModule,
    ServiceWorkerModule.register('/ngsw-worker.js', { enabled: environment.production })
  ],
  providers: [
    { provide: RouterStateSerializer, useClass: CustomSerializer }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {