Lazy Loaded Routing Problem after Upgrade to Angular 11

I have a top-level router that lazy loads child-routed feature modules, that has stopped working properly after upgrading to Angular v11.0.1.

Logging out at the Router events in ng11, the feature module is loaded, and RouteConfigLoadStart and RouteConfigLoadEnd are both triggered with the proper child router configuration, but RoutesRecognized is not called. If I click on the link (not routerLink) a second time, all events are triggered normally and the appropriate component loads.

For clarification: This is not just a problem with linking. It Doesn't work on initial page load either, unless I go to a different route (which also doesn't load the first time), and then back to the original route

This setup works properly (i.e. with a single click and on initial load) in Angular v10.2.3

AppRoutingModule:

const routes: Routes = [
    {path: '', redirectTo: '/dashboard', pathMatch: 'full'},
    {path: 'browse', loadChildren: () => import('./browse/browse.module').then(m => m.BrowseModule)},
    {path: 'dashboard', loadChildren: () => import('./dashboard/dashboard.module').then(m => m.DashboardModule)},
    {path: '**', redirectTo: '/dashboard'}
];

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

DashboardRoutingModule

const routes: Routes = [
    {path: '', component: DashboardComponent},
    {path: ':id', component: DashboardComponent}
];

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

AppModule

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        AppRoutingModule
    ],
    providers: [{provide: APP_BASE_HREF, useValue: ''}],
    bootstrap: [AppComponent]
})
export class AppModule { }

AppComponent template

<router-outlet></router-outlet>

I'm happy to provide any additional details that might help get to the bottom of this. Thanks in advance.

So, after a lot of playing with our build, I've figured it out! We're doing this in a blended environment where we have an "SPA" inside of a server-bound JSF container with the header as an Angular Element. Up until this point, I'd been using ng-build-plus and --extra-webpack-config to specify webpack.externals to share the common resources between the header and the SPA:

module.exports = {
    externals: {
        "rxjs": "rxjs",
        "@angular/core": "ng.core",
        "@angular/common": "ng.common",
        "@angular/common/http": "ng.common.http",
        "@angular/platform-browser": "ng.platformBrowser",
        "@angular/platform-browser-dynamic": "ng.platformBrowserDynamic",
        "@angular/compiler": "ng.compiler",
        "@angular/forms": "ng.forms"
    }
}

After taking this out of the SPA build, everything started working as expected. Looks like it might be an issue with how ngx-build-plus is stitching things together with externals that was the issue.