[SOLVED] WP5 Module Federation: Sharing deep imports

WP5 Module Federation: Sharing deep imports

Say I have the following Module Federation setup:

new ModuleFederationPlugin({
  name: 'shell',
  filename: 'shellDefinition.js',
  shared: {
      'my-shared-lib': { singleton: true, eager: true, requiredVersion: '^1.0.0' }
  },
})

This let's me share an import like the following with remotes:

import { myThing } from 'my-shared-lib';

However, what if I want to share a deep import, such as the following?

import myThing from 'my-shared-lib/things';

Doing this with the above setup seems to create a separate instance of the module in both the host and any remotes, which is perhaps understandable since we are not technically sharing the deep import. However, is there any way to get Module Federation to do so?

Solution

You should be able to the deep import as :

shared: {
  'my-shared-lib': { singleton: true, eager: true, requiredVersion: '^1.0.0' }
  'my-shared-lib/things': { singleton: true, eager: true, requiredVersion: '^1.0.0' }
}

They will still be two separate chunks, but will be shared by multiple remotes/hosts.