reactjs - 未捕获的错误：共享模块不可用于 React 模块联合中的即时消费

Question

consumes:146 Uncaught Error: Shared module is not available for eager consumption: webpack/sharing/consume/default/@emotion/react/@emotion/react?99ca
    at Object.__webpack_require__.m.<computed> (consumes:146)
    at __webpack_require__ (bootstrap:24)
    at fn (hot module replacement:61)
    at Module../src/index.tsx (utils.tsx:123)
    at __webpack_require__ (bootstrap:24)
    at startup:4
    at startup:6

new ModuleFederationPlugin({
      name: 'app-name',
      remotes: {
       app: 'XYZ/remoteEntry.js',
      },
      shared: {
        'react-dom': {
          eager: true,
          singleton: true,
        },
        react: {
          eager: true,
          singleton: true,
        },
        '@emotion/react': {
          eager: false,
        },
      },
    }),

shared共享这些组件的应用程序部分中存在相同的配置，但出现错误。我已经尝试过@emotion/react: {eager: true}，从共享部分中完全删除“@emotion/react”。但没有运气。

Answer 1

不确定它是否与 HMR 有关，但您是否为 typescript 启用了动态导入？

https://github.com/Microsoft/TypeScript/issues/16820

你index.tsx看起来像什么？