@umijs/mfsu 4.0.0-beta.12 → 4.0.0-beta.16

package/dist/babelPlugins/awaitImport/checkMatch.js

@@ -12,6 +12,9 @@ const isExternals_1 = require("./isExternals");
 // const UNMATCH_LIBS = ['umi', 'dumi', '@alipay/bigfish'];
 const RE_NODE_MODULES = /node_modules/;
 const RE_UMI_LOCAL_DEV = /umi(-next)?\/packages\//;
+function isUmiLocalDev(path) {
+    return RE_UMI_LOCAL_DEV.test(path);
+}
 function checkMatch({ value, path, opts, isExportAll, depth, cache, }) {
     var _a, _b;
     let isMatch;
@@ -20,6 +23,8 @@ function checkMatch({ value, path, opts, isExportAll, depth, cache, }) {
     (0, assert_1.default)(depth <= 10, `endless loop detected in checkMatch, please check your alias config.`);
     opts = opts || {};
     const remoteName = opts.remoteName || 'mf';
+    // FIXME: hard code for vite mode
+    value = value.replace(/^@fs\//, '/');
     if (
     // unMatch specified libs
     ((_a = opts.unMatchLibs) === null || _a === void 0 ? void 0 : _a.includes(value)) ||
@@ -38,7 +43,7 @@ function checkMatch({ value, path, opts, isExportAll, depth, cache, }) {
         isMatch = false;
     }
     else if ((0, path_1.isAbsolute)(value)) {
-        isMatch = RE_NODE_MODULES.test(value) || RE_UMI_LOCAL_DEV.test(value);
+        isMatch = RE_NODE_MODULES.test(value) || isUmiLocalDev(value);
     }
     else {
         const aliasedPath = (0, getAliasedPath_1.getAliasedPath)({

package/dist/dep/dep.js

@@ -40,7 +40,7 @@ class Dep {
         this.file = opts.file;
         this.version = opts.version;
         this.cwd = opts.cwd;
-        this.shortFile = this.file.replace(this.cwd, '$CWD$');
+        this.shortFile = this.file;
         this.normalizedFile = this.shortFile.replace(/\//g, '_').replace(/:/g, '_');
         this.filePath = `${constants_1.MF_VA_PREFIX}${this.normalizedFile}.js`;
         this.mfsu = opts.mfsu;

package/dist/depBuilder/depBuilder.js

@@ -63,11 +63,7 @@ class DepBuilder {
                 entry: {
                     [`${constants_1.MF_VA_PREFIX}remoteEntry`]: entryPath,
                 },
-                config: {
-                    outputPath: tmpDir,
-                    alias: this.opts.mfsu.alias,
-                    externals: this.opts.mfsu.externals,
-                },
+                config: Object.assign(Object.assign({}, this.opts.mfsu.opts.depBuildConfig), { outputPath: tmpDir, alias: this.opts.mfsu.alias, externals: this.opts.mfsu.externals }),
                 inlineStyle: true,
             });
             utils_1.logger.event(`[mfsu] compiled with esbuild successfully in ${+new Date() - date} ms`);

package/dist/mfsu.d.ts

@@ -14,8 +14,10 @@ interface IOpts {
     mode?: Mode;
     tmpBase?: string;
     unMatchLibs?: string[];
+    runtimePublicPath?: boolean | string;
     implementor: typeof webpack;
     buildDepWithESBuild?: boolean;
+    depBuildConfig: any;
 }
 export declare class MFSU {
     opts: IOpts;
@@ -25,10 +27,11 @@ export declare class MFSU {
     depBuilder: DepBuilder;
     depConfig: Configuration | null;
     constructor(opts: IOpts);
+    asyncImport(content: string): string;
     setWebpackConfig(opts: {
         config: Configuration;
         depConfig: Configuration;
-    }): void;
+    }): Promise<void>;
     buildDeps(): Promise<void>;
     getMiddlewares(): ((req: Request, res: Response, next: NextFunction) => void)[];
     getBabelPlugins(): (typeof autoExport | (typeof awaitImport | {

package/dist/mfsu.js

@@ -13,6 +13,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.MFSU = void 0;
+const bundler_utils_1 = require("@umijs/bundler-utils");
 const utils_1 = require("@umijs/utils");
 const fs_1 = require("fs");
 const path_1 = require("path");
@@ -46,56 +47,118 @@ class MFSU {
         this.depBuilder = new depBuilder_1.DepBuilder({ mfsu: this });
         this.depInfo.loadCache();
     }
+    // swc don't support top-level await
+    // ref: https://github.com/vercel/next.js/issues/31054
+    asyncImport(content) {
+        return `await import('${content}');`;
+        // return `(async () => await import('${content}'))();`;
+    }
     setWebpackConfig(opts) {
         var _a;
-        const { mfName } = this.opts;
-        /**
-         * config
-         */
-        // set alias and externals with reference for babel plugin
-        Object.assign(this.alias, ((_a = opts.config.resolve) === null || _a === void 0 ? void 0 : _a.alias) || {});
-        this.externals.push(...(0, makeArray_1.makeArray)(opts.config.externals || []));
-        // entry
-        const entry = {};
-        const virtualModules = {};
-        Object.keys(opts.config.entry).forEach((key) => {
-            const virtualPath = `./mfsu-virtual-entry/${key}.js`;
-            virtualModules[virtualPath] =
+        return __awaiter(this, void 0, void 0, function* () {
+            const { mfName } = this.opts;
+            /**
+             * config
+             */
+            // set alias and externals with reference for babel plugin
+            Object.assign(this.alias, ((_a = opts.config.resolve) === null || _a === void 0 ? void 0 : _a.alias) || {});
+            this.externals.push(...(0, makeArray_1.makeArray)(opts.config.externals || []));
+            // entry
+            const entry = {};
+            const virtualModules = {};
+            for (const key of Object.keys(opts.config.entry)) {
+                const virtualPath = `./mfsu-virtual-entry/${key}.js`;
+                const virtualContent = [];
+                let index = 1;
+                let hasDefaultExport = false;
                 // @ts-ignore
-                opts.config
-                    .entry[key].map((entry) => `await import('${entry}')`)
-                    .join('\n') + `\nexport default 1;`;
-            entry[key] = virtualPath;
+                for (const entry of opts.config.entry[key]) {
+                    const content = (0, fs_1.readFileSync)(entry, 'utf-8');
+                    const [_imports, exports] = yield (0, bundler_utils_1.parseModule)({ content, path: entry });
+                    if (exports.length) {
+                        virtualContent.push(`const k${index} = ${this.asyncImport(entry)}`);
+                        for (const exportName of exports) {
+                            if (exportName === 'default') {
+                                hasDefaultExport = true;
+                                virtualContent.push(`export default k${index}.${exportName}`);
+                            }
+                            else {
+                                virtualContent.push(`export const ${exportName} = k${index}.${exportName}`);
+                            }
+                        }
+                    }
+                    else {
+                        virtualContent.push(this.asyncImport(entry));
+                    }
+                    index += 1;
+                }
+                if (!hasDefaultExport) {
+                    virtualContent.push(`export default 1;`);
+                }
+                virtualModules[virtualPath] = virtualContent.join('\n');
+                entry[key] = virtualPath;
+            }
+            opts.config.entry = entry;
+            // plugins
+            opts.config.plugins = opts.config.plugins || [];
+            // support publicPath auto
+            let publicPath = opts.config.output.publicPath;
+            if (publicPath === 'auto') {
+                publicPath = '/';
+            }
+            opts.config.plugins.push(...[
+                new webpack_virtual_modules_1.default(virtualModules),
+                new this.opts.implementor.container.ModuleFederationPlugin({
+                    name: '__',
+                    remotes: {
+                        [mfName]: this.opts.runtimePublicPath
+                            ? // ref:
+                                // https://webpack.js.org/concepts/module-federation/#promise-based-dynamic-remotes
+                                `
+promise new Promise(resolve => {
+  const remoteUrlWithVersion = window.publicPath + '${constants_1.REMOTE_FILE_FULL}';
+  const script = document.createElement('script');
+  script.src = remoteUrlWithVersion;
+  script.onload = () => {
+    // the injected script has loaded and is available on window
+    // we can now resolve this Promise
+    const proxy = {
+      get: (request) => window['${mfName}'].get(request),
+      init: (arg) => {
+        try {
+          return window['${mfName}'].init(arg);
+        } catch(e) {
+          console.log('remote container already initialized');
+        }
+      }
+    }
+    resolve(proxy);
+  }
+  // inject this script with the src set to the versioned remoteEntry.js
+  document.head.appendChild(script);
+})
+                `.trimLeft()
+                            : `${mfName}@${publicPath}${constants_1.REMOTE_FILE_FULL}`,
+                    },
+                }),
+                new buildDepPlugin_1.BuildDepPlugin({
+                    onCompileDone: () => {
+                        this.buildDeps().catch((e) => {
+                            utils_1.logger.error(e);
+                        });
+                    },
+                }),
+                new writeCachePlugin_1.WriteCachePlugin({
+                    onWriteCache: () => {
+                        this.depInfo.writeCache();
+                    },
+                }),
+            ]);
+            /**
+             * depConfig
+             */
+            this.depConfig = opts.depConfig;
         });
-        opts.config.entry = entry;
-        // plugins
-        opts.config.plugins = opts.config.plugins || [];
-        opts.config.plugins.push(...[
-            new webpack_virtual_modules_1.default(virtualModules),
-            new this.opts.implementor.container.ModuleFederationPlugin({
-                name: '__',
-                remotes: {
-                    // TODO: support runtime public path
-                    [mfName]: `${mfName}@${opts.config.output.publicPath}${constants_1.REMOTE_FILE_FULL}`,
-                },
-            }),
-            new buildDepPlugin_1.BuildDepPlugin({
-                onCompileDone: () => {
-                    this.buildDeps().catch((e) => {
-                        utils_1.logger.error(e);
-                    });
-                },
-            }),
-            new writeCachePlugin_1.WriteCachePlugin({
-                onWriteCache: () => {
-                    this.depInfo.writeCache();
-                },
-            }),
-        ]);
-        /**
-         * depConfig
-         */
-        this.depConfig = opts.depConfig;
     }
     buildDeps() {
         return __awaiter(this, void 0, void 0, function* () {
@@ -126,7 +189,7 @@ class MFSU {
                         }
                         res.setHeader('content-type', (0, mrmime_1.lookup)((0, path_1.extname)(req.path)) || 'text/plain');
                         const relativePath = req.path.replace(new RegExp(`^${publicPath}`), '/');
-                        const content = (0, fs_1.readFileSync)((0, path_1.join)(this.opts.tmpBase, relativePath), 'utf-8');
+                        const content = (0, fs_1.readFileSync)((0, path_1.join)(this.opts.tmpBase, relativePath));
                         res.send(content);
                     });
                 }

package/dist/moduleGraph.js

@@ -20,7 +20,12 @@ class ModuleGraph {
         this.rootModules = new Set();
     }
     restore(data) {
+        let fileMap = new Map();
         const addNode = ({ file, importer }) => {
+            // fix circular dependency
+            if (fileMap.has(file))
+                return;
+            fileMap.set(file, true);
             const mod = new ModuleNode(file);
             let isDependency = false;
             let info;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/mfsu",
-  "version": "4.0.0-beta.12",
+  "version": "4.0.0-beta.16",
   "description": "@umijs/mfsu",
   "homepage": "https://github.com/umijs/umi-next/tree/master/packages/mfsu#readme",
   "bugs": "https://github.com/umijs/umi-next/issues",
@@ -21,9 +21,9 @@
     "dev": "pnpm build -- --watch"
   },
   "dependencies": {
-    "@umijs/bundler-esbuild": "4.0.0-beta.12",
-    "@umijs/bundler-utils": "4.0.0-beta.12",
-    "@umijs/utils": "4.0.0-beta.12"
+    "@umijs/bundler-esbuild": "4.0.0-beta.16",
+    "@umijs/bundler-utils": "4.0.0-beta.16",
+    "@umijs/utils": "4.0.0-beta.16"
   },
   "devDependencies": {
     "@types/express": "4.17.13",