I am using Angular 17.1, Nx 18, webpack 5 Module Federation.
I can't share as a singleton service every mfe create new instance.
What am I doing wrong? Please help :)
project directory text
tsconfig.base.json
{
"compileOnSave": false,
"compilerOptions": {
"rootDir": ".",
"sourceMap": true,
"declaration": false,
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2015",
"module": "esnext",
"lib": ["es2020", "dom"],
"skipLibCheck": true,
"skipDefaultLibCheck": true,
"baseUrl": ".",
"paths": {
"@workspace/util": ["libs/util/src/index.ts"]
}
},
"exclude": ["node_modules", "tmp"]
host webpack.config.js
module.exports = {
plugins: [
new ModuleFederationPlugin({
shared: {
"@angular/core": {
"singleton": true
},
"@angular/common": {
"singleton": true
},
"@angular/router": {
"singleton": true
},
"@workspace/util": {
"singleton": true,
"import": "libs/util/src/index"
},
"rxjs": {
"singleton": true
},
}
}),
],
mfe webpack.config.js
module.exports = {
output: {
publicPath: 'auto',
uniqueName: 'md',
scriptType: 'text/javascript',
},
optimization: {
runtimeChunk: false,
},
plugins: [
new ModuleFederationPlugin({
name: 'md',
library: { type: 'var', name: 'md' },
filename: 'remoteEntry.js',
exposes: {
MainApp: './apps/md/src/bootstrap.ts',
},
shared: {
"@angular/core": {
"singleton": true
},
"@angular/common": {
"singleton": true
},
"@angular/router": {
"singleton": true
},
"@workspace/util": {
"singleton": true,
"import": "libs/util/src/index"
},
"rxjs": {
"singleton": true
},
}
}),
],
Related Question enter link description here
I also try withModuleFederationPlugin (@angular-architects/module-federation/webpack) with config shareAll but result doesn't change