@module-federation/sdk 0.0.0-next-20231219090402 → 0.0.0-next-20231219093556

package/__tests__/simpleJoinRemoteEntry.spec.ts

@@ -0,0 +1,53 @@
+import { simpleJoinRemoteEntry } from '../src/generateSnapshotFromManifest';
+
+describe('simpleJoinRemoteEntry', () => {
+  it('return remoteEntryName while remoteEntryPath is empty', () => {
+    const remoteEntry = {
+      name: 'vmok-remote-entry.js',
+      path: '',
+    };
+    expect(simpleJoinRemoteEntry(remoteEntry.path, remoteEntry.name)).toEqual(
+      remoteEntry.name,
+    );
+  });
+
+  it('normalize remoteEntryPath while remoteEntryPath startsWith "."', () => {
+    const remoteEntry = {
+      name: 'vmok-remote-entry.js',
+      path: '.',
+    };
+    expect(simpleJoinRemoteEntry(remoteEntry.path, remoteEntry.name)).toEqual(
+      remoteEntry.name,
+    );
+  });
+
+  it('normalize remoteEntryPath while remoteEntryPath startsWith "./"', () => {
+    const remoteEntry = {
+      name: 'vmok-remote-entry.js',
+      path: './dist/vmok',
+    };
+    expect(simpleJoinRemoteEntry(remoteEntry.path, remoteEntry.name)).toEqual(
+      `dist/vmok/${remoteEntry.name}`,
+    );
+  });
+
+  it('normalize remoteEntryPath while remoteEntryPath startsWith "/"', () => {
+    const remoteEntry = {
+      name: 'vmok-remote-entry.js',
+      path: '/dist/vmok',
+    };
+    expect(simpleJoinRemoteEntry(remoteEntry.path, remoteEntry.name)).toEqual(
+      `dist/vmok/${remoteEntry.name}`,
+    );
+  });
+
+  it('normalize remoteEntryPath while remoteEntryPath endsWith "/"', () => {
+    const remoteEntry = {
+      name: 'vmok-remote-entry.js',
+      path: '/dist/vmok/',
+    };
+    expect(simpleJoinRemoteEntry(remoteEntry.path, remoteEntry.name)).toEqual(
+      `dist/vmok/${remoteEntry.name}`,
+    );
+  });
+});

package/dist/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023-present zhanghang(2heal1)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@module-federation/sdk",
+  "version": "0.3.0",
+  "license": "MIT",
+  "description": "A sdk for support module federation",
+  "keywords": [
+    "Module Federation",
+    "sdk"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "author": "zhanghang <hanric.zhang@gmail.com>",
+  "sideEffects": false,
+  "main": "./index.cjs.js",
+  "module": "./index.esm.js",
+  "types": "./dist/index.cjs.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js",
+      "types": "./dist/index.cjs.d.ts"
+    },
+    "./normalize-webpack-path": {
+      "import": "./dist/normalize-webpack-path.esm.js",
+      "require": "./dist/normalize-webpack-path.cjs.js",
+      "types": "./dist/src/normalize-webpack-path.cjs.d.ts"
+    }
+  },
+  "typesVersions": {
+    "*": {
+      ".": [
+        "./dist/index.cjs.d.ts"
+      ],
+      "normalize-webpack-path": [
+        "./dist/normalize-webpack-path.cjs.d.ts"
+      ]
+    }
+  }
+}

package/jest.config.js

@@ -0,0 +1,27 @@
+// For a detailed explanation regarding each configuration property, visit:
+// https://jestjs.io/docs/en/configuration.html
+
+module.exports = {
+  clearMocks: true,
+  testEnvironment: 'jsdom',
+  coveragePathIgnorePatterns: ['__tests__', '/node_modules/'],
+  coverageProvider: 'v8',
+  coverageReporters: ['cobertura', 'clover', 'json', 'lcov', 'text'],
+  globals: {
+    __DEV__: true,
+    __TEST__: true,
+    __BROWSER__: false,
+    __VERSION__: '"unknow"',
+  },
+  preset: 'ts-jest',
+  transformIgnorePatterns: [
+    // Change MODULE_NAME_HERE to your module that isn't being compiled
+    '/node_modules/(?!((@byted/garfish-)|(byted-tea-sdk))).+\\.js$',
+  ],
+  transform: {
+    '^.+\\.(t|j)sx?$': ['@swc/jest'],
+  },
+  rootDir: __dirname,
+  testMatch: ['<rootDir>__tests__/**/**.spec.[jt]s?(x)'],
+  testPathIgnorePatterns: ['/node_modules/'],
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@module-federation/sdk",
-  "version": "0.0.0-next-20231219090402",
+  "version": "0.0.0-next-20231219093556",
   "license": "MIT",
   "description": "A sdk for support module federation",
   "keywords": [
@@ -12,21 +12,20 @@
   },
   "author": "zhanghang <hanric.zhang@gmail.com>",
   "sideEffects": false,
-  "main": "./index.cjs.js",
-  "module": "./index.esm.js",
+  "main": "./dist/index.cjs.js",
+  "module": "./dist/index.esm.js",
   "types": "./dist/index.cjs.d.ts",
   "exports": {
     ".": {
-      "module": "./index.esm.js",
-      "import": "./index.cjs.mjs",
-      "default": "./index.cjs.js"
+      "import": "./dist/index.esm.js",
+      "require": "./dist/index.cjs.js",
+      "types": "./dist/index.cjs.d.ts"
     },
     "./normalize-webpack-path": {
-      "module": "./normalize-webpack-path.esm.js",
-      "import": "./normalize-webpack-path.cjs.mjs",
-      "default": "./normalize-webpack-path.cjs.js"
-    },
-    "./package.json": "./package.json"
+      "import": "./dist/normalize-webpack-path.esm.js",
+      "require": "./dist/normalize-webpack-path.cjs.js",
+      "types": "./dist/src/normalize-webpack-path.cjs.d.ts"
+    }
   },
   "typesVersions": {
     "*": {

package/project.json

@@ -0,0 +1,65 @@
+{
+  "name": "sdk",
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "packages/sdk/src",
+  "projectType": "library",
+  "targets": {
+    "build": {
+      "executor": "@nx/rollup:rollup",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "packages/sdk/dist",
+        "main": "packages/sdk/src/index.ts",
+        "tsConfig": "packages/sdk/tsconfig.lib.json",
+        "assets": [],
+        "external": ["@module-federation/*"],
+        "project": "packages/sdk/package.json",
+        "additionalEntryPoints": ["packages/sdk/src/normalize-webpack-path.ts"],
+        "rollupConfig": "packages/sdk/rollup.config.js",
+        "compiler": "swc",
+        "format": ["cjs", "esm"]
+      }
+    },
+    "lint": {
+      "executor": "@nx/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": [
+          "packages/sdk/**/*.ts",
+          "packages/sdk/package.json"
+        ]
+      }
+    },
+    "test": {
+      "executor": "@nx/jest:jest",
+      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
+      "options": {
+        "jestConfig": "packages/sdk/jest.config.js",
+        "passWithNoTests": true
+      },
+      "configurations": {
+        "ci": {
+          "ci": true,
+          "codeCoverage": true
+        }
+      }
+    },
+    "pre-release": {
+      "executor": "nx:run-commands",
+      "options": {
+        "parallel": false,
+        "commands": [
+          {
+            "command": "nx run sdk:test",
+            "forwardAllArgs": false
+          },
+          {
+            "command": "nx run sdk:build",
+            "forwardAllArgs": false
+          }
+        ]
+      }
+    }
+  },
+  "tags": ["package"]
+}

package/rollup.config.js

@@ -0,0 +1,11 @@
+const copy = require('rollup-plugin-copy');
+
+module.exports = (rollupConfig, _projectOptions) => {
+  rollupConfig.plugins.push(
+    copy({
+      targets: [{ src: 'packages/sdk/LICENSE', dest: 'packages/sdk/dist' }],
+    }),
+  );
+
+  return rollupConfig;
+};

package/src/constant.ts

@@ -0,0 +1,24 @@
+export const FederationModuleManifest = 'federation-manifest.json';
+export const MANIFEST_EXT = '.json';
+
+export const BROWSER_LOG_KEY = 'FEDERATION_DEBUG';
+export const BROWSER_LOG_VALUE = '1';
+
+export const NameTransformSymbol = {
+  AT: '@',
+  HYPHEN: '-',
+  SLASH: '/',
+};
+export const NameTransformMap = {
+  [NameTransformSymbol.AT]: 'scope_',
+  [NameTransformSymbol.HYPHEN]: '_',
+  [NameTransformSymbol.SLASH]: '__',
+};
+
+export const EncodedNameTransformMap = {
+  [NameTransformMap[NameTransformSymbol.AT]]: NameTransformSymbol.AT,
+  [NameTransformMap[NameTransformSymbol.HYPHEN]]: NameTransformSymbol.HYPHEN,
+  [NameTransformMap[NameTransformSymbol.SLASH]]: NameTransformSymbol.SLASH,
+};
+
+export const SEPARATOR = ':';

package/src/dom.ts

@@ -0,0 +1,115 @@
+import { warn } from './utils';
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export async function safeWrapper<T extends (...args: Array<any>) => any>(
+  callback: T,
+  disableWarn?: boolean,
+): Promise<ReturnType<T> | undefined> {
+  try {
+    const res = await callback();
+    return res;
+  } catch (e) {
+    !disableWarn && warn(e);
+    return;
+  }
+}
+
+export function isStaticResourcesEqual(url1: string, url2: string): boolean {
+  const REG_EXP = /^(https?:)?\/\//i;
+  // Transform url1 and url2 into relative paths
+  const relativeUrl1 = url1.replace(REG_EXP, '').replace(/\/$/, '');
+  const relativeUrl2 = url2.replace(REG_EXP, '').replace(/\/$/, '');
+  // Check if the relative paths are identical
+  return relativeUrl1 === relativeUrl2;
+}
+
+export function createScript(
+  url: string,
+  cb: (value: void | PromiseLike<void>) => void,
+  attrs?: Record<string, any>,
+  createScriptHook?: (url: string) => HTMLScriptElement | void,
+): { script: HTMLScriptElement; needAttach: boolean } {
+  // Retrieve the existing script element by its src attribute
+  let script: HTMLScriptElement | null = null;
+  let needAttach = true;
+  const scripts = document.getElementsByTagName('script');
+  for (let i = 0; i < scripts.length; i++) {
+    const s = scripts[i];
+    const scriptSrc = s.getAttribute('src');
+    if (scriptSrc && isStaticResourcesEqual(scriptSrc, url)) {
+      script = s;
+      needAttach = false;
+      break;
+    }
+  }
+
+  if (!script) {
+    script = document.createElement('script');
+    script.type = 'text/javascript';
+    script.src = url;
+    if (createScriptHook) {
+      const createScriptRes = createScriptHook(url);
+      if (createScriptRes instanceof HTMLScriptElement) {
+        script = createScriptRes;
+      }
+    }
+  }
+
+  if (attrs) {
+    Object.keys(attrs).forEach((name) => {
+      if (script) {
+        if (name === 'async' || name === 'defer') {
+          script[name] = attrs[name];
+        } else {
+          script.setAttribute(name, attrs[name]);
+        }
+      }
+    });
+  }
+
+  const onScriptComplete = (
+    prev: OnErrorEventHandler | GlobalEventHandlers['onload'] | null,
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    event: any,
+  ): void => {
+    // Prevent memory leaks in IE.
+    if (script) {
+      script.onerror = null;
+      script.onload = null;
+      safeWrapper(() => {
+        script?.parentNode && script.parentNode.removeChild(script);
+      });
+      if (prev) {
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const res = (prev as any)(event);
+        cb();
+        return res;
+      }
+    }
+    cb();
+  };
+
+  script.onerror = onScriptComplete.bind(null, script.onerror);
+  script.onload = onScriptComplete.bind(null, script.onload);
+
+  return { script, needAttach };
+}
+
+export function loadScript(
+  url: string,
+  info: {
+    attrs?: Record<string, any>;
+    createScriptHook?: (url: string) => HTMLScriptElement | void;
+  },
+) {
+  const { attrs, createScriptHook } = info;
+  return new Promise<void>((resolve, _reject) => {
+    const { script, needAttach } = createScript(
+      url,
+      resolve,
+      attrs,
+      createScriptHook,
+    );
+    needAttach && document.getElementsByTagName('head')[0].appendChild(script);
+  });
+}

package/src/env.ts

@@ -0,0 +1,25 @@
+declare global {
+  // eslint-disable-next-line no-var
+  var FEDERATION_DEBUG: string | undefined;
+}
+
+function isBrowserEnv(): boolean {
+  return typeof window !== 'undefined';
+}
+
+function isDebugMode(): boolean {
+  if (
+    typeof process !== 'undefined' &&
+    process.env &&
+    process.env['FEDERATION_DEBUG']
+  ) {
+    return Boolean(process.env['FEDERATION_DEBUG']);
+  }
+  return typeof FEDERATION_DEBUG !== 'undefined' && Boolean(FEDERATION_DEBUG);
+}
+
+const getProcessEnv = function (): Record<string, string | undefined> {
+  return typeof process !== 'undefined' && process.env ? process.env : {};
+};
+
+export { isBrowserEnv, isDebugMode, getProcessEnv };

package/src/generateSnapshotFromManifest.ts

@@ -0,0 +1,176 @@
+import {
+  Manifest,
+  ProviderModuleInfo,
+  ModuleInfo,
+  BasicProviderModuleInfo,
+  ConsumerModuleInfo,
+  ManifestProvider,
+} from './types';
+import { MANIFEST_EXT } from './constant';
+
+interface IOptions {
+  remotes?: Record<string, string>;
+  overrides?: Record<string, string>;
+  version?: string;
+}
+
+export const simpleJoinRemoteEntry = (rPath: string, rName: string): string => {
+  if (!rPath) {
+    return rName;
+  }
+  const transformPath = (str: string) => {
+    if (str === '.') {
+      return '';
+    }
+    if (str.startsWith('./')) {
+      return str.replace('./', '');
+    }
+    if (str.startsWith('/')) {
+      const strWithoutSlash = str.slice(1);
+      if (strWithoutSlash.endsWith('/')) {
+        return strWithoutSlash.slice(0, -1);
+      }
+      return strWithoutSlash;
+    }
+    return str;
+  };
+
+  const transformedPath = transformPath(rPath);
+
+  if (!transformedPath) {
+    return rName;
+  }
+
+  if (transformedPath.endsWith('/')) {
+    return `${transformedPath}${rName}`;
+  }
+
+  return `${transformedPath}/${rName}`;
+};
+
+// Priority: overrides > remotes
+// eslint-disable-next-line max-lines-per-function
+export function generateSnapshotFromManifest(
+  manifest: Manifest,
+  options: IOptions = {},
+): ProviderModuleInfo {
+  const { remotes = {}, overrides = {}, version } = options;
+  let remoteSnapshot: ProviderModuleInfo;
+
+  const getPublicPath = (): string => {
+    if ('publicPath' in manifest.metaData) {
+      return manifest.metaData.publicPath;
+    } else {
+      return manifest.metaData.getPublicPath;
+    }
+  };
+
+  const overridesKeys = Object.keys(overrides);
+
+  let remotesInfo: ConsumerModuleInfo['remotesInfo'] = {};
+
+  // If remotes are not provided, only the remotes in the manifest will be read
+  if (!Object.keys(remotes).length) {
+    remotesInfo =
+      manifest.remotes?.reduce(
+        (res, next) => {
+          let matchedVersion: string;
+          const name = next.federationContainerName;
+          // overrides have higher priority
+          if (overridesKeys.includes(name)) {
+            matchedVersion = overrides[name];
+          } else {
+            if ('version' in next) {
+              matchedVersion = next.version;
+            } else {
+              matchedVersion = next.entry;
+            }
+          }
+          res[name] = {
+            matchedVersion,
+          };
+          return res;
+        },
+        {} as ConsumerModuleInfo['remotesInfo'],
+      ) || {};
+  }
+
+  // If remotes (deploy scenario) are specified, they need to be traversed again
+  Object.keys(remotes).forEach(
+    (key) =>
+      (remotesInfo[key] = {
+        // overrides will override dependencies
+        matchedVersion: overridesKeys.includes(key)
+          ? overrides[key]
+          : remotes[key],
+      }),
+  );
+
+  const {
+    remoteEntry: {
+      path: remoteEntryPath,
+      name: remoteEntryName,
+      type: remoteEntryType,
+    },
+    types: remoteTypes,
+    buildInfo: { buildVersion },
+    globalName,
+  } = manifest.metaData;
+  const { exposes } = manifest;
+
+  let basicRemoteSnapshot: BasicProviderModuleInfo = {
+    version: version ? version : '',
+    buildVersion,
+    globalName,
+    remoteEntry: simpleJoinRemoteEntry(remoteEntryPath, remoteEntryName),
+    remoteEntryType,
+    remoteTypes: simpleJoinRemoteEntry(remoteTypes.path, remoteTypes.name),
+    remotesInfo,
+    shared: manifest?.shared.map((item) => ({
+      assets: item.assets,
+      sharedName: item.name,
+    })),
+    modules: exposes?.map((expose) => ({
+      moduleName: expose.name,
+      modulePath: expose.path,
+      assets: expose.assets,
+    })),
+  };
+
+  if (manifest.metaData?.prefetchEntry) {
+    const { path, name, type } = manifest.metaData.prefetchEntry;
+
+    basicRemoteSnapshot = {
+      ...basicRemoteSnapshot,
+      prefetchEntry: simpleJoinRemoteEntry(path, name),
+      prefetchEntryType: type,
+    };
+  }
+
+  if ('publicPath' in manifest.metaData) {
+    remoteSnapshot = {
+      ...basicRemoteSnapshot,
+      publicPath: getPublicPath(),
+    };
+  } else {
+    remoteSnapshot = {
+      ...basicRemoteSnapshot,
+      getPublicPath: getPublicPath(),
+    };
+  }
+
+  return remoteSnapshot;
+}
+
+export function isManifestProvider(
+  moduleInfo: ModuleInfo | ManifestProvider,
+): moduleInfo is ManifestProvider {
+  if (
+    'remoteEntry' in moduleInfo &&
+    moduleInfo.remoteEntry.endsWith(MANIFEST_EXT)
+  ) {
+    return true;
+  } else {
+    return false;
+  }
+}

package/src/index.ts

@@ -0,0 +1,10 @@
+export * from './constant';
+export * from './types';
+export * from './utils';
+export {
+  generateSnapshotFromManifest,
+  isManifestProvider,
+} from './generateSnapshotFromManifest';
+export * from './logger';
+export * from './env';
+export * from './dom';

package/src/logger.ts

@@ -0,0 +1,59 @@
+import { BROWSER_LOG_KEY, BROWSER_LOG_VALUE } from './constant';
+import { isBrowserEnv, isDebugMode } from './env';
+
+function safeToString(info: any): string {
+  try {
+    return JSON.stringify(info, null, 2);
+  } catch (e) {
+    return '';
+  }
+}
+
+const DEBUG_LOG = '[ FEDERATION DEBUG ]';
+
+class Logger {
+  enable = false;
+  identifier: string;
+  constructor(identifier?: string) {
+    this.identifier = identifier || DEBUG_LOG;
+    if (
+      isBrowserEnv() &&
+      localStorage.getItem(BROWSER_LOG_KEY) === BROWSER_LOG_VALUE
+    ) {
+      this.enable = true;
+    } else if (isDebugMode()) {
+      this.enable = true;
+    }
+  }
+  info(msg: string, info?: any): void {
+    if (this.enable) {
+      const argsToString = safeToString(info) || '';
+      if (isBrowserEnv()) {
+        console.info(
+          `%c ${this.identifier}: ${msg} ${argsToString}`,
+          'color:#3300CC',
+        );
+      } else {
+        console.info(
+          '\x1b[34m%s',
+          `${this.identifier}: ${msg} ${
+            argsToString ? `\n${argsToString}` : ''
+          }`,
+        );
+      }
+    }
+  }
+  logOriginalInfo(...args: unknown[]) {
+    if (this.enable) {
+      if (isBrowserEnv()) {
+        console.info(`%c ${this.identifier}: OriginalInfo`, 'color:#3300CC');
+        console.log(...args);
+      } else {
+        console.info(`%c ${this.identifier}: OriginalInfo`, 'color:#3300CC');
+        console.log(...args);
+      }
+    }
+  }
+}
+
+export { Logger };