Module Federation support like Angular/React with Nx natively?
codef0rmerz opened this issue · comments
Is there any example/documentation available to enable module federation in the generated vue3 application?
I've tried to do this but getting an error Cannot read property 'includes' of undefined
const { ModuleFederationPlugin } = require('webpack').container;
module.exports = (config) => {
config.plugins.push(
new ModuleFederationPlugin({
name: 'profileSettings',
filename: 'remoteEntry.js',
exposes: {
'./HelloWorld': './src/components/HelloWorld',
},
})
);
};
I further debugged the issue and found out that it's because of missing output.enabledLibraryTypes
property in config
. But when I tried to setup an empty array against enabledLibraryTypes
property in output
, it yells with invalid schema warning.
Cannot read property 'includes' of undefined
TypeError: Cannot read property 'includes' of undefined
at ModuleFederationPlugin.apply (/node_modules/webpack/lib/container/ModuleFederationPlugin.js:52:49)
```
Is there a recommended example of setting up Module Federation with a vue-cli application? I'm not too familiar with module federation but if you share a repo that exhibits your webpack changes not being respected I can help debug
Thanks @ZachJW34 for helping. You can check https://github.com/module-federation/module-federation-examples/tree/master/vue3-cli-demo example and try to plug in the MF configurations in configure-webpack.js
of the generated app via nx-plus.
I see that the demo is using vue-cli v5, which uses Webpack 5. I plan on getting to the upgrade soon which should help #228