admin管理员组

文章数量:1387360

Been trying out Webpack's 5 Module Federation and came upon this problem. Tried many approaches but none seem to work. Basically when I try to use styled-ponents on a federated module, I get React's Invalid hook call error.

Here is a repository which tries to reproduce the problem:

I wonder if I'm missing something or if this is some kind of bug.

Been trying out Webpack's 5 Module Federation and came upon this problem. Tried many approaches but none seem to work. Basically when I try to use styled-ponents on a federated module, I get React's Invalid hook call error.

Here is a repository which tries to reproduce the problem:

  • https://github./oncet/federated-modules-styled-ponents

I wonder if I'm missing something or if this is some kind of bug.

  • javascript
  • reactjs
  • webpack
  • styled-ponents
Share Improve this question edited Oct 14, 2020 at 15:30 Camilo asked Oct 5, 2020 at 3:17 CamiloCamilo 7,2245 gold badges45 silver badges66 bronze badges 1
  • Made a bug report github./styled-ponents/styled-ponents/issues/3302 – Camilo Commented Oct 11, 2020 at 5:02
Add a ment  | 

1 Answer 1

Reset to default 7

Problem solved by telling Webpack to use React as a singleton.

In foo/webpack.config.js I changed shared to [{ react: { singleton: true } }].

new ModuleFederationPlugin({
  name: 'foo',
  filename: 'remoteEntry.js',
  exposes: {
    './Foo': './src/App',
  },
  shared: [{ react: { singleton: true } }],
})

Big thanks to Zach Jackson!

本文标签：

版权声明：本文标题：javascript - Conflict between styled-components and Webpack 5 Federated Modules (Invalid hook call) - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744566551a2613082.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。