shared 用于在消费者和生产间共享公共依赖,降低运行时下载体积从而提升性能,shared 可以配置依赖版本的复用规则,可以通过 FAQ 了解 shared 适用场景以及如何使用 shared
PluginSharedOptionsundefinedPluginSharedOptions 类型如下:
booleanfalse是否在共享作用域中只允许共享模块的一个版本 (单例模式).
stringrequire('project/package.json')[devDeps | dep]['depName']所需版本,可以是一个版本区间。默认值为当前应用的依赖版本。
eager 设置为 true 后,会将共享依赖打包到入口文件,从而导致入口文件体积过大。请谨慎开启。
booleanfalse是否立即加载共享模块。
正常情况下,需要开启异步入口,随后按需异步加载 shared 。 若想使用 shared ,但又不想开启异步入口,那么可以设置 eager 为 true 。
string'default'共享依赖作用域,默认值为 'default' 。
string | falseundefined共享依赖的导入路径,默认值为 undefined 。
若设置为 false ,则不会将此 shared 打包到产物中,仅使用消费者提供的 shared。 因此设置前请确认消费者已提供对应 shared。
booleanfalse开启后,共享解析会使用模块解析路径中 node_modules/ 之后的部分进行后缀匹配。当宿主与远程通过不同的绝对路径解析同一依赖(例如 pnpm hoisting、软链接或自定义打包器加载路径)时,可以借助该选项依然匹配到同一个共享模块。
该选项此前名为
nodeModulesReconstructedLookup。
string[]undefined手动添加共享依赖被使用的导出成员。
'server-calc' | 'runtime-infer'undefined配置 treeshaking 的加载策略。
runtime-infer: 根据消费方的 usedExports 进行推断,如果提供方的 usedExports 符合当前消费方的 usedExports,那么就会使用提供方的 shared,否则会使用消费方自身的 shared,如果都不满足,就使用全量的。server-calc: 根据服务端下发的 snapshot 来决定是否加载共享依赖。stringundefined指定 treeShaking 后的共享模块输出的文件名。
跨项目消费模块往往会碰到重复依赖加载、依赖单例限制等问题,这些问题可以通过设置 shared 来解决。
lodash.getreactlodash (未按需引用)antd那么此时可以在 shared 配置中添加对应的依赖。
根据使用场景,Module Federation 支持两种形式配置共享依赖,分别是 数组、对象。前者适用于大部分场景,后者适用于复杂的定制需求。
数组格式(通用场景)
仅需在 Module Federation 构建配置中的 shared 配置添加对应的依赖即可,例如:
对象格式(定制化配置)
在 Module Federation 中的 shared 配置添加需要共享的依赖, key 为依赖名称,value 为提供的配置。