@esmx/rspack 3.0.0-rc.11 → 3.0.0-rc.111

package/dist/rspack-html/target-setting.test.mjs

@@ -0,0 +1,105 @@
+import { describe, expect, it } from "vitest";
+import { getTargetSetting, PRESET_TARGETS } from "./target-setting.mjs";
+describe("getTargetSetting", () => {
+  const buildTargets = ["client", "server", "node"];
+  describe("when setting is undefined", () => {
+    it("should return compatible preset for all build targets", () => {
+      buildTargets.forEach((buildTarget) => {
+        const result = getTargetSetting(void 0, buildTarget);
+        expect(result).toEqual(PRESET_TARGETS.compatible[buildTarget]);
+      });
+    });
+  });
+  describe("when setting is a string preset", () => {
+    it("should return compatible preset for all build targets", () => {
+      buildTargets.forEach((buildTarget) => {
+        const result = getTargetSetting("compatible", buildTarget);
+        expect(result).toEqual(PRESET_TARGETS.compatible[buildTarget]);
+      });
+    });
+    it("should return modern preset for all build targets", () => {
+      buildTargets.forEach((buildTarget) => {
+        const result = getTargetSetting("modern", buildTarget);
+        expect(result).toEqual(PRESET_TARGETS.modern[buildTarget]);
+      });
+    });
+  });
+  describe("when setting is a custom array", () => {
+    const customTargets = ["chrome>=90", "firefox>=80", "safari>=14"];
+    it("should return the custom array for all build targets", () => {
+      buildTargets.forEach((buildTarget) => {
+        const result = getTargetSetting(customTargets, buildTarget);
+        expect(result).toEqual(customTargets);
+      });
+    });
+  });
+  describe("when setting is an object with specific build targets", () => {
+    it("should return specified preset for configured build targets", () => {
+      const setting = {
+        client: "modern",
+        server: "compatible"
+      };
+      expect(getTargetSetting(setting, "client")).toEqual(
+        PRESET_TARGETS.modern.client
+      );
+      expect(getTargetSetting(setting, "server")).toEqual(
+        PRESET_TARGETS.compatible.server
+      );
+    });
+    it("should return compatible preset for unconfigured build targets", () => {
+      const setting = {
+        client: "modern"
+      };
+      expect(getTargetSetting(setting, "client")).toEqual(
+        PRESET_TARGETS.modern.client
+      );
+      expect(getTargetSetting(setting, "server")).toEqual(
+        PRESET_TARGETS.compatible.server
+      );
+      expect(getTargetSetting(setting, "node")).toEqual(
+        PRESET_TARGETS.compatible.node
+      );
+    });
+    it("should return custom array for configured build targets", () => {
+      const customClientTargets = ["chrome>=90", "firefox>=80"];
+      const customServerTargets = ["node>=18"];
+      const setting = {
+        client: customClientTargets,
+        server: customServerTargets
+      };
+      expect(getTargetSetting(setting, "client")).toEqual(
+        customClientTargets
+      );
+      expect(getTargetSetting(setting, "server")).toEqual(
+        customServerTargets
+      );
+      expect(getTargetSetting(setting, "node")).toEqual(
+        PRESET_TARGETS.compatible.node
+      );
+    });
+    it("should handle mixed preset and custom configurations", () => {
+      const setting = {
+        client: "modern",
+        server: ["node>=18"],
+        node: "compatible"
+      };
+      expect(getTargetSetting(setting, "client")).toEqual(
+        PRESET_TARGETS.modern.client
+      );
+      expect(getTargetSetting(setting, "server")).toEqual(["node>=18"]);
+      expect(getTargetSetting(setting, "node")).toEqual(
+        PRESET_TARGETS.compatible.node
+      );
+    });
+  });
+  describe("edge cases", () => {
+    it("should handle empty custom array", () => {
+      const result = getTargetSetting([], "client");
+      expect(result).toEqual([]);
+    });
+    it("should handle single item custom array", () => {
+      const result = getTargetSetting(["chrome>=90"], "client");
+      expect(result).toEqual(["chrome>=90"]);
+    });
+  });
+});

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@esmx/rspack",
-    "description": "A high-performance Rspack integration for Esmx microfrontend framework, providing module federation and SSR capabilities.",
+    "description": "A high-performance Rspack integration for Esmx microfrontend framework, providing Module Linking and SSR capabilities.",
     "contributors": [
         {
             "name": "lzxb",
@@ -38,18 +38,21 @@
         "Less",
         "High Performance",
         "Build Tool",
-        "Module Federation",
+        "Module Linking",
         "SSR",
         "Development Experience"
     ],
     "scripts": {
         "lint:js": "biome check --write --no-errors-on-unmatched",
-        "lint:css": "stylelint '**/*.{css,vue}' --fix --aei",
+        "lint:css": "pnpm run lint:js",
         "lint:type": "tsc --noEmit",
         "test": "vitest run --pass-with-no-tests",
         "coverage": "vitest run --coverage --pass-with-no-tests",
         "build": "unbuild"
     },
+    "engines": {
+        "node": ">=24"
+    },
     "peerDependencies": {
         "@esmx/core": "*",
         "less": "*"
@@ -60,36 +63,35 @@
         }
     },
     "dependencies": {
-        "@esmx/import": "3.0.0-rc.11",
-        "@esmx/rspack-module-link-plugin": "3.0.0-rc.11",
-        "@npmcli/arborist": "^8.0.0",
-        "@rspack/core": "1.2.8",
+        "@esmx/import": "3.0.0-rc.111",
+        "@npmcli/arborist": "^9.1.6",
+        "@rspack/core": "1.7.2",
         "css-loader": "^7.1.2",
-        "less-loader": "^12.2.0",
+        "less-loader": "^12.3.0",
         "node-polyfill-webpack-plugin": "^4.1.0",
         "pacote": "^21.0.0",
+        "rspack-chain": "^1.4.3",
         "style-loader": "^4.0.0",
         "style-resources-loader": "^1.5.0",
+        "upath": "^2.0.1",
         "webpack-hot-middleware": "^2.26.1",
         "webpack-node-externals": "~3.0.0",
         "worker-rspack-loader": "^3.1.2"
     },
     "devDependencies": {
-        "@biomejs/biome": "1.9.4",
-        "@esmx/core": "3.0.0-rc.11",
-        "@esmx/lint": "3.0.0-rc.11",
-        "@types/node": "22.13.10",
-        "@types/npmcli__arborist": "^5.6.11",
+        "@biomejs/biome": "2.3.7",
+        "@esmx/core": "3.0.0-rc.111",
+        "@types/node": "^24.0.0",
+        "@types/npmcli__arborist": "^6.3.1",
         "@types/pacote": "^11.1.8",
-        "@types/webpack-hot-middleware": "^2.25.9",
+        "@types/webpack-hot-middleware": "^2.25.12",
         "@types/webpack-node-externals": "^3.0.4",
-        "@vitest/coverage-v8": "3.0.8",
-        "stylelint": "16.15.0",
-        "typescript": "5.8.2",
-        "unbuild": "2.0.0",
-        "vitest": "3.0.8"
+        "@vitest/coverage-v8": "3.2.4",
+        "typescript": "5.9.3",
+        "unbuild": "3.6.1",
+        "vitest": "3.2.4"
     },
-    "version": "3.0.0-rc.11",
+    "version": "3.0.0-rc.111",
     "type": "module",
     "private": false,
     "exports": {
@@ -108,5 +110,5 @@
         "template",
         "public"
     ],
-    "gitHead": "0920e0485284528eb642a7078f4cb48b013352a5"
+    "gitHead": "3c8faeeebc43d40e13b9907c1723f8ecf107ddc2"
 }

package/src/index.ts

@@ -1,11 +1,12 @@
 export {
+    type BuildTarget,
+    createRspackApp,
+    RSPACK_LOADER,
+    type RspackAppChainContext,
     type RspackAppConfigContext,
-    type RspackAppOptions,
-    createRspackApp
-} from './app';
-export { createRspackHtmlApp, type RspackHtmlAppOptions } from './html-app';
-export type { BuildTarget } from './build-target';
-export { RSPACK_LOADER } from './loader';
+    type RspackAppOptions
+} from './rspack';
+export { createRspackHtmlApp, type RspackHtmlAppOptions } from './rspack-html';
 
 import * as rspack from '@rspack/core';
 

package/src/module-link/config.ts

@@ -0,0 +1,157 @@
+import type { ExternalItem, ExternalItemFunctionData } from '@rspack/core';
+import type RspackChain from 'rspack-chain';
+import type { ParsedModuleLinkPluginOptions } from './types';
+
+export function applyEntryConfig(
+    chain: RspackChain,
+    opts: ParsedModuleLinkPluginOptions
+): void {
+    if (chain.entryPoints.has('main')) {
+        const mainEntry = chain.entry('main');
+        if (mainEntry.values().length === 0) {
+            chain.entryPoints.clear();
+        }
+    }
+
+    for (const value of Object.values(opts.exports)) {
+        if (value.file) {
+            const entry = chain.entry(value.name);
+            for (const preEntry of opts.preEntries) {
+                entry.add(preEntry);
+            }
+            entry.add(value.file);
+        }
+    }
+}
+
+export function applyModuleConfig(chain: RspackChain) {
+    chain.output
+        .set('module', true)
+        .set('chunkFormat', 'module')
+        .set('chunkLoading', 'import')
+        .set('workerChunkLoading', 'import');
+    chain.output.library({
+        type: 'module'
+    });
+}
+
+export function applyExternalsConfig(
+    chain: RspackChain,
+    opts: ParsedModuleLinkPluginOptions
+): void {
+    const existingExternals = chain.get('externals') || [];
+    const externals: ExternalItem[] = Array.isArray(existingExternals)
+        ? [...existingExternals]
+        : [existingExternals];
+
+    const compilerContext = chain.get('context') ?? process.cwd();
+    const externalFunc = createExternalsFunction(opts, compilerContext);
+    externals.push(externalFunc);
+
+    chain.externals(externals);
+}
+
+function createExternalsFunction(
+    opts: ParsedModuleLinkPluginOptions,
+    compilerContext: string
+) {
+    const importMap = new Map<string, string>();
+    let initPromise: Promise<void> | null = null;
+    type ResolvePath = (
+        request: string,
+        context?: string
+    ) => Promise<string | null>;
+    const init = (resolvePath: ResolvePath): Promise<void> => {
+        if (initPromise) return initPromise;
+
+        initPromise = (async () => {
+            await Promise.all(
+                Object.values(opts.exports).map(async (value) => {
+                    const identifier = value.pkg
+                        ? value.name
+                        : value.identifier;
+                    importMap.set(identifier, identifier);
+                    importMap.set(value.name, identifier);
+
+                    const resolvedPath = await resolvePath(value.file);
+                    if (resolvedPath) {
+                        importMap.set(resolvedPath, identifier);
+                    }
+                })
+            );
+
+            for (const key of Object.keys(opts.imports)) {
+                importMap.set(key, key);
+            }
+        })();
+
+        return initPromise;
+    };
+
+    const match = async (
+        request: string,
+        context: string,
+        resolvePath: ResolvePath
+    ): Promise<string | null> => {
+        if (!request) return null;
+
+        if (opts.deps.length > 0) {
+            const matchedDep = opts.deps.find(
+                (dep) => request === dep || request.startsWith(`${dep}/`)
+            );
+            if (matchedDep) {
+                return request;
+            }
+        }
+
+        let importName = importMap.get(request);
+        if (!importName) {
+            const resolvedPath = await resolvePath(request, context);
+            if (resolvedPath) {
+                importName = importMap.get(resolvedPath);
+            }
+        }
+
+        return importName || null;
+    };
+
+    const FILE_EXT_REGEX =
+        /\.worker\.(js|mjs|cjs|jsx|mjsx|cjsx|ts|mts|cts|tsx|mtsx|ctsx)$/i;
+
+    return async (data: ExternalItemFunctionData) => {
+        if (
+            !data.request ||
+            !data.context ||
+            !data.contextInfo?.issuer ||
+            FILE_EXT_REGEX.test(data.contextInfo.issuer)
+        )
+            return;
+
+        const defaultContext = compilerContext;
+        const resolvePath: ResolvePath = async (
+            request: string,
+            context = defaultContext
+        ): Promise<string | null> => {
+            if (!data.getResolve) {
+                return null;
+            }
+            const resolveFunc = data.getResolve();
+            return new Promise<string | null>((resolve) => {
+                resolveFunc(context, request, (err, res) => {
+                    resolve(typeof res === 'string' ? res : null);
+                });
+            });
+        };
+
+        await init(resolvePath);
+        const matchedIdentifier = await match(
+            data.request,
+            data.context,
+            resolvePath
+        );
+
+        if (matchedIdentifier) {
+            return `module-import ${matchedIdentifier}`;
+        }
+    };
+}

package/src/module-link/config1.ts

@@ -0,0 +1,24 @@
+import type RspackChain from 'rspack-chain';
+import {
+    applyEntryConfig,
+    applyExternalsConfig,
+    applyModuleConfig
+} from './config';
+import type { ParsedModuleLinkPluginOptions } from './types';
+
+export function applyChainConfig1(
+    chain: RspackChain,
+    opts: ParsedModuleLinkPluginOptions
+): void {
+    applyEntryConfig(chain, opts);
+    applyExternalsConfig(chain, opts);
+
+    // Set module compilation configuration
+    applyModuleConfig(chain);
+    if (chain.get('mode') === 'production') {
+        chain.output.library({
+            type: 'modern-module'
+        });
+        chain.optimization.set('avoidEntryIife', true);
+    }
+}

package/src/module-link/config2.ts

@@ -0,0 +1,28 @@
+import { rspack } from '@rspack/core';
+import type RspackChain from 'rspack-chain';
+import {
+    applyEntryConfig,
+    applyExternalsConfig,
+    applyModuleConfig
+} from './config';
+import type { ParsedModuleLinkPluginOptions } from './types';
+
+export function applyChainConfig2(
+    chain: RspackChain,
+    opts: ParsedModuleLinkPluginOptions
+): void {
+    applyEntryConfig(chain, opts);
+    applyExternalsConfig(chain, opts);
+
+    // Set module compilation configuration
+    if (chain.get('mode') === 'production') {
+        chain.output.set('module', true);
+
+        chain
+            .plugin('esm-library')
+            .use(new rspack.experiments.EsmLibraryPlugin());
+        chain.optimization.set('runtimeChunk', 'single');
+    } else {
+        applyModuleConfig(chain);
+    }
+}

package/src/module-link/index.ts

@@ -0,0 +1,19 @@
+import type RspackChain from 'rspack-chain';
+import { applyChainConfig1 } from './config1';
+// import { applyChainConfig2 } from './config2';
+import { ManifestPlugin } from './manifest-plugin';
+import { parseOptions } from './parse';
+import type { ModuleLinkPluginOptions } from './types';
+
+export function initModuleLink(
+    chain: RspackChain,
+    options: ModuleLinkPluginOptions
+): void {
+    const opts = parseOptions(options);
+    applyChainConfig1(chain, opts);
+    // applyChainConfig2(chain, opts);
+
+    chain.plugin('module-link-manifest').use(ManifestPlugin, [opts]);
+}
+
+export type { ModuleLinkPluginOptions } from './types';

package/src/module-link/manifest-plugin.ts

@@ -0,0 +1,179 @@
+import type { Compilation, Compiler, StatsCompilation } from '@rspack/core';
+import upath from 'upath';
+import type {
+    ManifestJson,
+    ManifestJsonChunks,
+    ManifestJsonExports,
+    ParsedModuleLinkPluginOptions
+} from './types';
+
+export const RSPACK_PLUGIN_NAME = 'rspack-module-link-plugin';
+
+export class ManifestPlugin {
+    constructor(private opts: ParsedModuleLinkPluginOptions) {}
+
+    apply(compiler: Compiler) {
+        const opts = this.opts;
+        const { Compilation } = compiler.rspack;
+        compiler.hooks.thisCompilation.tap(
+            RSPACK_PLUGIN_NAME,
+            (compilation) => {
+                let manifestJson: ManifestJson = {
+                    name: opts.name,
+                    exports: {},
+                    scopes: opts.scopes,
+                    files: [],
+                    chunks: {}
+                };
+
+                compilation.hooks.processAssets.tap(
+                    {
+                        name: RSPACK_PLUGIN_NAME,
+                        stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL
+                    },
+                    (assets) => {
+                        const stats = compilation.getStats().toJson({
+                            hash: true,
+                            entrypoints: true
+                        });
+
+                        const exports = getExports(opts, stats);
+                        const resources = Object.keys(assets)
+                            .map(transFileName)
+                            .filter((file) => !file.includes('hot-update'));
+                        manifestJson = {
+                            name: opts.name,
+                            exports: exports,
+                            scopes: opts.scopes,
+                            files: resources,
+                            chunks: getChunks(opts, compilation)
+                        };
+                        const { RawSource } = compiler.rspack.sources;
+
+                        compilation.emitAsset(
+                            'manifest.json',
+                            new RawSource(JSON.stringify(manifestJson, null, 4))
+                        );
+                    }
+                );
+
+                if (opts.injectChunkName) {
+                    compilation.hooks.processAssets.tap(
+                        {
+                            name: RSPACK_PLUGIN_NAME,
+                            stage: Compilation.PROCESS_ASSETS_STAGE_ADDITIONS
+                        },
+                        (assets) => {
+                            const { RawSource } = compiler.rspack.sources;
+                            for (const [key, value] of Object.entries(
+                                manifestJson.chunks
+                            )) {
+                                const asset = assets[value.js];
+                                if (!asset) {
+                                    return;
+                                }
+                                const source = new RawSource(
+                                    `import.meta.chunkName = import.meta.chunkName ?? ${JSON.stringify(key)};\n${asset.source()}`
+                                );
+
+                                compilation.updateAsset(value.js, source);
+                            }
+                        }
+                    );
+                }
+            }
+        );
+    }
+}
+
+function transFileName(fileName: string): string {
+    return fileName.replace(/^.\//, '');
+}
+
+export function getExports(
+    opts: ParsedModuleLinkPluginOptions,
+    stats: StatsCompilation
+): ManifestJsonExports {
+    const entrypoints = stats.entrypoints || {};
+    const exports: ManifestJsonExports = {};
+    for (const [key, value] of Object.entries(entrypoints)) {
+        const asset = value.assets?.find((item) => {
+            return (
+                item.name.endsWith(opts.ext) &&
+                item.name.startsWith(key) &&
+                !item.name.includes('hot-update')
+            );
+        });
+        if (!asset) continue;
+        if (key in opts.exports) {
+            exports[key] = {
+                ...opts.exports[key],
+                file: asset.name
+            };
+        }
+    }
+    return exports;
+}
+
+function getChunks(
+    opts: ParsedModuleLinkPluginOptions,
+    compilation: Compilation
+) {
+    const stats = compilation.getStats().toJson({
+        all: false,
+        chunks: true,
+        modules: true,
+        chunkModules: true,
+        ids: true
+    });
+    const buildChunks: ManifestJsonChunks = {};
+    if (!stats.chunks) return buildChunks;
+
+    for (const chunk of stats.chunks) {
+        const module = chunk.modules
+            ?.sort((a, b) => {
+                return (a.index ?? -1) - (b?.index ?? -1);
+            })
+            ?.find((module) => {
+                return module.moduleType?.includes('javascript/');
+            });
+        if (!module?.nameForCondition) continue;
+
+        const js = chunk.files?.find((file) => file.endsWith(opts.ext));
+        if (!js) continue;
+
+        const root = compilation.options.context ?? process.cwd();
+        const name = generateIdentifier({
+            root,
+            name: opts.name,
+            filePath: module.nameForCondition
+        });
+
+        const css = chunk.files?.filter((file) => file.endsWith('.css')) ?? [];
+        const resources = chunk.auxiliaryFiles ?? [];
+        buildChunks[name] = {
+            name,
+            js,
+            css,
+            resources
+        };
+    }
+    return buildChunks;
+}
+
+export function generateIdentifier({
+    root,
+    name,
+    filePath
+}: {
+    root: string;
+    name: string;
+    filePath: string;
+}) {
+    const unixFilePath = upath.toUnix(filePath);
+    if (!root) {
+        return `${name}@${unixFilePath}`;
+    }
+    const file = upath.relative(upath.toUnix(root), unixFilePath);
+    return `${name}@${file}`;
+}

package/src/module-link/parse.ts

@@ -0,0 +1,31 @@
+import type {
+    ModuleLinkPluginOptions,
+    ParsedModuleLinkPluginOptions
+} from './types';
+
+export function parseOptions(
+    options: ModuleLinkPluginOptions
+): ParsedModuleLinkPluginOptions {
+    const exports: ParsedModuleLinkPluginOptions['exports'] = {};
+    if (options.exports) {
+        for (const [name, item] of Object.entries(options.exports)) {
+            exports[name] = {
+                name,
+                pkg: !!item.pkg,
+                file: item.file,
+                identifier: `${options.name}/${name}`
+            };
+        }
+    }
+    const deps = (options.deps ?? []).filter((name) => name !== options.name);
+    return {
+        name: options.name,
+        ext: options.ext ? `.${options.ext}` : '.mjs',
+        exports,
+        imports: options.imports ?? {},
+        scopes: options.scopes ?? {},
+        injectChunkName: options.injectChunkName ?? false,
+        preEntries: options.preEntries ?? [],
+        deps
+    };
+}

package/src/module-link/types.ts

@@ -0,0 +1,31 @@
+import type { ManifestJsonExports } from '@esmx/core';
+
+export type {
+    ManifestJson,
+    ManifestJsonChunk,
+    ManifestJsonChunks,
+    ManifestJsonExport,
+    ManifestJsonExports
+} from '@esmx/core';
+
+export interface ModuleLinkPluginOptions {
+    name: string;
+    ext?: string;
+    imports?: Record<string, string>;
+    scopes?: Record<string, Record<string, string>>;
+    exports?: Record<string, { pkg?: boolean; file: string }>;
+    injectChunkName?: boolean;
+    preEntries?: string[];
+    deps?: string[];
+}
+
+export interface ParsedModuleLinkPluginOptions {
+    name: string;
+    ext: string;
+    exports: ManifestJsonExports;
+    imports: Record<string, string>;
+    scopes: Record<string, Record<string, string>>;
+    injectChunkName: boolean;
+    preEntries: string[];
+    deps: string[];
+}