styled-components 和 Webpack 5 Federated Modules

Question

一直在尝试 Webpack 的 5 Module Federation 并遇到了这个问题。尝试了很多方法，但似乎都不起作用。基本上，当我尝试styled-components在联合模块上使用时，我会收到 React 的Invalid hook call错误。

这是一个试图重现问题的存储库：

• https://github.com/oncet/federated-modules-styled-components

我想知道我是否遗漏了什么或者这是某种错误。

Answer 1

通过告诉 Webpack 将 React 作为单例使用来解决问题。在foo/webpack.config.js我shared改为[{ react: { singleton: true } }].new ModuleFederationPlugin({  name: 'foo',  filename: 'remoteEntry.js',  exposes: {    './Foo': './src/App',  },  shared: [{ react: { singleton: true } }],})