1

我试图配置一个简单的模块联合，如下所示。

webpack.config1

new ModuleFederationPlugin({
        name: "Picture",
        filename: "entryPoint.js",
        exposes: {
          "./Gallery": "./mySrc/components/Gallery.js",
        },
      }),

index.js

import("Picture/Gallery").then((comp) => {
  console.log(comp);
});

Gallery.js

export default 3;

webpack.config2

new ModuleFederationPlugin({
    name: "Consumer",
    filename: "entryPoint.js",
    remotes: {
      Picture: "Gallery@http://localhost:3000/entryPoint.js",
    },
  }),

我收到这条消息：

entryPoint.js":1 Uncaught (in promise) ScriptExternalLoadError: Loading script failed. (missing: http://localhost:3000/entryPoint.js) while loading "./Gallery" from webpack/container/reference/Picture at Object. webpack/container/reference/Picture (entryPoint.js":1) at webpack_require (bootstrap:24) at handleFunction (remotes loading:33) at remotes loading:52 at Array.forEach () at Object. webpack_require .f.remotes (remotes loading:15) at ensure chunk:6 at Array.reduce () at Function. Function.fn.e 处的webpack_require .e（确保块：5）（热模块更换：81）

4

1 回答 1

1

您的导入webpack.config2似乎是错误的。在webpack.config1您以 Picture 名称定义您的应用程序时。所以webpack.config2应该是这样的：

new ModuleFederationPlugin({
  name: "Consumer",
  filename: "entryPoint.js",
  remotes: {
    Picture: "Picture@http://localhost:3000/entryPoint.js",
  },
}),
于 2021-09-16T06:46:37.120 回答