Angular 19 + Keycloak: TypeError: A is not a constructor after production build (works in dev)

I am trying to setup an angular (19) app, within an Nx project, with keycloak authentication. The problem I am facing is that, after building the app, I get the following error when accessing it in the browser console and the app does not load:

main.2bf01af6f4d363d0.js:1 TypeError: A is not a constructor


where the A is inside this generated function:

function G(e) {
const i = new A(e.config), <------ This is the line with the error
n = e.providers ?? [],
t = U(i);
return (0,
s.makeEnvironmentProviders)([{
provide: k,
useValue: t
}, {
provide: A,
useValue: i
}, ...n, L(i, e)])
}


In the call stack, this is what invokes it:

u.provideKeycloak)(s)


Which makes me understand that the error is with the providers setup in app.config.ts:

import { ApplicationConfig, provideZoneChangeDetection } from '@angular/core';
import { provideRouter } from '@angular/router';
import { appRoutes } from './app.routes';
...
const environment = {...};
...
export const appConfig: ApplicationConfig = {
providers: [
createAuthConfig(environment),
provideZoneChangeDetection({ eventCoalescing: true }),
provideRouter(appRoutes),
],
};


Where createAuthConfig looks like this:

export function createAuthConfig(environment) {
// Create URL condition for bearer token
const urlCondition = createInterceptorCondition<IncludeBearerTokenCondition>({
urlPattern: new RegExp(`...`),
bearerPrefix: 'Bearer'
});

const provideCfg : ProvideKeycloakOptions = {
config: {
url: ...,
realm: ...,
clientId: ...
},
initOptions: {
onLoad: 'check-sso',
silentCheckSsoRedirectUri: window?.location.origin + '/assets/silent-check-sso.html',
checkLoginIframe: false
},
features: [
withAutoRefreshToken({
onInactivityTimeout: 'logout',
sessionTimeout: 60000 // 1 minute
})
],
providers: [
AutoRefreshTokenService,
UserActivityService,
{
provide: INCLUDE_BEARER_TOKEN_INTERCEPTOR_CONFIG,
useValue: [urlCondition]
},
provideHttpClient(withInterceptors([includeBearerTokenInterceptor]))
]
};

console.log('Keycloak config:', provideCfg);
return provideKeycloak(provideCfg);
}


This issue DOES NOT occur when serving the app through the dev server.

Any idea what could be wrong?

Continue reading...