Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/432.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181

Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/webpack/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript WP5模块联合:单例多次实例化_Javascript_Webpack_Webpack 5_Webpack Module Federation - Fatal编程技术网

Javascript WP5模块联合:单例多次实例化

Javascript WP5模块联合:单例多次实例化,javascript,webpack,webpack-5,webpack-module-federation,Javascript,Webpack,Webpack 5,Webpack Module Federation,不幸的是,我的报告是在一个复杂的专有项目,所以我会尽我所能解释到底发生了什么 与我的用例最接近的示例项目是: 基本上,我有一个全方位的设置,其中一个Shell应用程序使用一组远程应用程序。远程应用是在运行时发现的,因此不会在Webpack配置中指定 Shell和所有远程设备都依赖于共享库my shared lib: "dependencies": { "my-shared-lib": "^1.0.0" } Shell在其Web

不幸的是,我的报告是在一个复杂的专有项目,所以我会尽我所能解释到底发生了什么

与我的用例最接近的示例项目是: 基本上,我有一个全方位的设置,其中一个Shell应用程序使用一组远程应用程序。远程应用是在运行时发现的,因此不会在Webpack配置中指定

Shell和所有远程设备都依赖于共享库my shared lib:

"dependencies": {
    "my-shared-lib": "^1.0.0"
}
Shell在其Webpack配置中将此库公开为一个急切的单例:

new ModuleFederationPlugin({
  name: 'shell',
  filename: 'shellDefinition.js',
  shared: {
      'my-shared-lib': { singleton: true, eager: true, requiredVersion: '^1.0.0' }
  },
}),
远程设备在其配置中也将其作为共享,但并不急于:

new ModuleFederationPlugin({
  name: 'remoteNameHere',
  filename: 'remoteDefinition.js',
  exposes: {
    './app': path.join(modulePath, 'app.js'),
  },
  shared: {
      'my-shared-lib': { singleton: true, eager: false, requiredVersion: '^1.0.0' }
  },
})
问题在于:我已经通过运行时调试和检查Webpack生成的bundle验证了这个lib被包含并实例化了好几次——一次用于shell,一次用于每个远程。lib的代码甚至存在于获取公开文件时Web包加载的远程文件包包中。/app.js

我不知道这里发生了什么事。我还试图共享共享库的每一个依赖项,但这没有帮助

我的期望是远程用户使用Shell共享的共享库实例,而不是创建自己的实例

我是否完全误解了依赖项共享的工作原理,或者我做了其他错误的事情


需要注意的是,Shell和Remots都有一个入口点。

对于您的remotes网页包模块联合配置,请尝试删除singleton选项(在两个配置中都设置它可能会有问题,您只需要一个应用程序来初始化singleton)和eager选项(我认为默认情况下这是错误的,该选项告诉您在检查共享依赖项之前加载依赖项,因此您主要在containers应用程序上使用它)。这就是我在配置(多个远程)上所做的,它似乎工作得很好:

new ModuleFederationPlugin({
  name: 'remoteNameHere',
  filename: 'remoteDefinition.js',
  exposes: {
    './app': path.join(modulePath, 'app.js'),
  },
  shared: {
      'my-shared-lib': { requiredVersion: '^1.0.0' }
  },
})

PS(我们永远不知道):在使用模块联合时,您可能会遇到树型库的问题,它会在共享时下载整个库。

您所说的每个远程包含/实例化是什么意思?您是否从多个URL加载多个块?