使用模块联合的微前端 - 无法使用共享的引导 css 模块

问：

我正在使用并尝试创建一个演示，其中我有一个 Gatsby 项目（让我们说它是客户端），它公开了这 2 个组件：module-federationMicro Fronetend

1. 带有 & 的组件。HelloWorldHelloWorld.module.cssHelloWorld.css
2. 一个组件，它是 Bootstrap 5.3.2 标头示例。Header

以下是 Client 的配置：

module.exports = {
  plugins: [
    // 'gatsby-plugin-sass',
    {
      resolve: 'gatsby-plugin-federation',
      options: {
        ssr: process.env.MF_SSR !== 'false',
        federationConfig: {
          name: 'remote',
          exposes: {
            // Exported components
            './HelloWorld': './src/components/HelloWorld',
            './Header': './src/components/Header',
          },
          shared: {
            bootstrap: { singleton: true, eager: true, import: "bootstrap/dist/css/bootstrap.min.css" }
          },
        },
      },
    },
  ],
}

它正在导出对象下的组件，我能够将它们导入另一个 Gatsby 和 ReactJS 项目中，并且它还公开为共享依赖项。 以下是文件片段：exposesBootstrapremoteEntry.js

switch(name) {
/******/                case "default": {
/******/                    register("@gatsbyjs/reach-router", "2.0.1", function() { return Promise.all([__webpack_require__.e("framework"), __webpack_require__.e("node_modules_gatsby_dist_internal-plugins_bundle-optimisations_polyfills_object-assign_js-nod-07400b")]).then(function() { return function() { return __webpack_require__(/*! ./node_modules/@gatsbyjs/reach-router/dist/index.modern.mjs */ "./node_modules/@gatsbyjs/reach-router/dist/index.modern.mjs"); }; }); });
/******/                    register("bootstrap", "5.3.2", function() { return Promise.all([__webpack_require__.e("styles-node_modules_bootstrap_dist_css_bootstrap_min_css"), __webpack_require__.e("node_modules_bootstrap_dist_css_bootstrap_min_css")]).then(function() { return function() { return __webpack_require__(/*! ./node_modules/bootstrap/dist/css/bootstrap.min.css */ "./node_modules/bootstrap/dist/css/bootstrap.min.css"); }; }); });
/******/                    register("react-dom", "18.2.0", function() { return Promise.all([__webpack_require__.e("framework"), __webpack_require__.e("webpack_sharing_consume_default_react_react")]).then(function() { return function() { return __webpack_require__(/*! ./node_modules/react-dom/index.js */ "./node_modules/react-dom/index.js"); }; }); });

在这个文件中，我可以看到它暴露了，但不知何故，我无法在 Gatsby 和 ReactJS 项目中导入和应用它。Bootstrap 5.3.2Header

请帮助我最好在 ReactJS 项目中使用此共享导出的依赖项。

提前致谢。

附言：如果您想查看一些我尚未在此处添加的代码片段，请告诉我，我会添加它。