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 } }],

})