feat: shared-directory

[zhangHongEn]

module-federation/vite#131

An alternative solution for the functionality of shared: ["./shared/xxxx.js"].

[github-actions]

Workflow status is success ✅
Unfortunately test report wasn't generated, it can be if no workspaces changed. Please check the workflow run below.
Link to GitHub workflow: Github Workflow Link

[github-actions]

Workflow status is success ✅
Unfortunately test report wasn't generated, it can be if no workspaces changed. Please check the workflow run below.
Link to GitHub workflow: Github Workflow Link

[github-actions]

Workflow status is success ✅
Unfortunately test report wasn't generated, it can be if no workspaces changed. Please check the workflow run below.
Link to GitHub workflow: Github Workflow Link

[github-actions]

Workflow status is success ✅
Unfortunately test report wasn't generated, it can be if no workspaces changed. Please check the workflow run below.
Link to GitHub workflow: Github Workflow Link

[Pong420]

Thanks for the example, it is helpful.
For my case I am using vite as the host and found some issues with the plugin

There is my version

import type { FederationRuntimePlugin } from '@module-federation/enhanced/runtime';

type LoadEntryParams = Parameters<NonNullable<FederationRuntimePlugin['loadEntry']>>[0];
type RemoteEntryExports = Awaited<ReturnType<NonNullable<FederationRuntimePlugin['loadEntry']>>>;

const modules = import.meta.glob(['./*.ts', '!./plugin.ts']) as Record<string, () => Promise<Record<string, any>>>;

export default function () {
  return {
    name: 'delegate-modules-plugin',
    loadEntry({ remoteInfo }: LoadEntryParams) {
      if (remoteInfo.name === 'shared') {
        const exports: RemoteEntryExports = {
          init() {},
          get(id: string) {
            return () => modules[id + '.ts']();
          }
        };
        return exports;
      }
    }
  };
}

Issues

1. dynamic import not work as expected, so using

const modules = import.meta.glob(['./*.ts', '!./plugin.ts']) as Record<string, () => Promise<Record<string, any>>>;

2. By the type definition, the get function is a function that return a function that will return Promise instead of a async function Promise<() => any>. But both works

type RemoteEntryExports = {
    get: (id: string) => () => Promise<Module>;
    init: (shareScope: ShareScopeMap[string], initScope?: InitScope, remoteEntryInitOPtions?: RemoteEntryInitOptions) => void | Promise<void>;
};

3. No idea why destructure the object and assign the __esModule will make it not work in host but work in remote

get(id: string) {
  return async () => {
    const result = await modules[id + '.ts']();
    return {
      ...result,
      __esModule: true
    };
  };
}

[zhangHongEn]

@Pong420
1. The import(`./${path}`) in the example is valid. As a demonstration, this is the simplest approach, and using import.meta.glob() is absolutely correct.
2. host works correctly in this example.

[ScriptedAlchemy]

This is same as how webpack would do it as far as I remember.