Getting "RuntimeError: NG0400: A platform with a different configuration has been created....

Both shell and MFE are running on Angular 17 and 18 respectively. I'm exposing the bootstrapping function of MFE to shell. When the shell invokes it, I'm getting "RuntimeError: NG0400: A platform with a different configuration has been created. Please destroy it first." Why could this be? Is it that the the shell and MFE cannot have differing versions of Angular?

Shell's webpack config uses @angular-architects/module-federation/webpack for module federation config and the shared libraries list looks like this-

shared: {
...shareAll({ singleton: true, strictVersion: true, requiredVersion: 'auto' }),
}


MFE's webpack config looks like this -

shared: {
"@angular/core": { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
"@angular/common": { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
"@angular/router": { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
"@angular/forms": { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
'@angular/platform-browser': { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
'@angular/platform-browser-dynamic': { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
'@angular/animations': { singleton: true, strictVersion: false, requiredVersion: '^18.0.0', eager: false, version: "^18.2.3" },
'rxjs': { singleton: true, strictVersion: false, requiredVersion: '~7.8.0', eager: false, version: "~7.8.0"},
}


Tried toggling strictVersion on MFE

Continue reading...