NextJS 模块联合远程到 React 应用程序主机

问：

我有一个 Next JS 全栈应用程序，我正在尝试将其拆分为模块。我按照 @module-federation/nextjs-mf 的文档中所示实现。我在next.config.mjs中的配置如下所示：

webpack(config, options) {
        const { webpack, isServer } = options
        config.resolve.fallback = {
            ...config.resolve.fallback,
            fs: false,
        }
        config.plugins.push(
            new NextFederationPlugin({
                name: 'remote',
                remotes: {},
                filename: 'static/chunks/remoteEntry.js',
                exposes: {
                    './theComponent':
                        './src/components/HomeComponents/TheComponent/TheComponent.tsx',
                },
                shared: {
                    react: { eager: true, singleton: true },
                },
                extraOptions: {},
            }),
        )

        return config

在 react 主机应用程序上，我有 webpack.config.ts 包含以下内容：

 plugins: [
            new ModuleFederationPlugin({
                name: 'host',
                filename: 'remoteEntry.js',
                remotes: {
                    remote: `remote@http://localhost:3001/_next/static/chunks/remoteEntry.js`,
                },
            }),
        ],

我收到一个打字稿编译错误，但即使它被静音，在运行时也找不到模块。

const TheComponent = lazy(() => import('remote/theComponent') as Promise<{ default: React.FC<any> }>);

导航到 react 应用程序的使用部分时的网络请求如下所示：

我可以看到 remoteEntry.js 以及 _next/static/chunks/ 中感兴趣的块，看起来像是正确的组件代码，只是不确定为什么它没有正确导入到主机应用程序中。人们可以提供的任何指导都是值得赞赏的！