'Module Federation Two Way Sharing Invalid Token
I'm attempting to pull a remote into module shared over module federation but am getting an error when consuming the exposed module, Uncaught SyntaxError: Unexpected token ':'
The module being pulled as the remote:
module.exports = {
experiments: {
outputModule: true
},
plugins: [new ModuleFederationPlugin({
// For remotes (please adjust)
name: "angularRouter",
remoteType: "module",
filename: "remoteEntry.js",
exposes: {
"./Router": "./src/bootstrap.ts",
},
shared: {
"@angular/common": { singleton: true, requiredVersion: deps['@angular/common'], eager: false },
"angular/core": { singleton: true, requiredVersion: deps['@angular/core'], eager: false},
"@angular/router": { singleton: true, requiredVersion: deps['@angular/router'], eager: false}
}
})]
I've tried remoteType script and module and library: { type: "var", name: "angularRouter"},
The module that consumes the first and then is exposed
plugins: [
new ModuleFederationPlugin({
// For remotes (please adjust)
name: "mfe4",
library: { type: "var", name: "mfe4" },
filename: "remoteEntry.js",
exposes: {
'./web-components': './app.js',
},
remotes: {
angularRouter: "http://localhost:4206/remoteEntry.js"
},
shared: ["react", "react-dom"]
})
]
I've tried this with angularRouter: "http://localhost:4206/remoteEntry.js" and angularRouter: "angularRouter@http://localhost:4206/remoteEntry.js"
No matter what I do I get the following output in the generated remoteEntry file
module.exports = http://localhost:4206/remoteEntry.js;
Is there a way to get the first exposed module to be consumed as a remote and forwarded properly into the second remoteEntry file?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
