#shareScope

shareScope specifies which shared dependency pools (Share Scope) a producer participates in. You can think of a Share Scope as a named shared-dependency pool: dependencies are only reused within the same Scope.

• Type: string | string[]
• Required: No
• Default: 'default'

#What It Does

• Controls which Share Scopes a producer initializes at runtime.
• Works with shared[*].shareScope: a shared dependency only participates in the Scope it is assigned to.
• Works with remotes[remote].shareScope: the consumer must align the Scopes it wants to reuse with the producer, otherwise missing Scopes are treated as empty and cannot be reused.

#Examples

#Single Scope (Default)

new ModuleFederationPlugin({
  name: 'app_remote',
  shareScope: 'default',
});

#Multiple Scopes (Isolated Shared Pools)

new ModuleFederationPlugin({
  name: 'app_remote',
  shareScope: ['default', 'scope1'],
  shared: {
    react: {
      singleton: true,
      requiredVersion: false,
      shareScope: 'default',
    },
    '@company/design-system': {
      singleton: true,
      requiredVersion: false,
      shareScope: 'scope1',
    },
  },
});

#Notes

• shareScope declares which Share Scopes this module initializes. It does not automatically put dependencies into those Scopes; that is controlled by each shared entry's shareScope.
• To actually reuse dependencies across apps, the producer and consumer typically need to agree on the same Scopes. See remotes.shareScope.