npm - @rmc-toolkit/vite - Versions diffs - 0.1.0 - Mend

@rmc-toolkit/vite 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (13) hide show

package/dist/index.d.ts +25 -0
package/dist/index.d.ts.map +1 -0
package/dist/index.js +102 -0
package/dist/index.test.d.ts +2 -0
package/dist/index.test.d.ts.map +1 -0
package/dist/index.test.js +169 -0
package/dist/slice-build.d.ts +9 -0
package/dist/slice-build.d.ts.map +1 -0
package/dist/slice-build.js +40 -0
package/dist/slice-build.test.d.ts +2 -0
package/dist/slice-build.test.d.ts.map +1 -0
package/dist/slice-build.test.js +71 -0
package/package.json +30 -0

package/dist/index.d.ts ADDED Viewed

@@ -0,0 +1,25 @@
+import { type RuntimeCompositionManifest, type RuntimeEnvironment } from "@rmc-toolkit/core";
+import type { Plugin } from "vite";
+export type RuntimeCompositionViteOptions = {
+    manifest: RuntimeCompositionManifest;
+    environment?: RuntimeEnvironment;
+    includeImportMap?: boolean;
+    externalize?: boolean;
+};
+export declare const createRollupExternal: (manifest: RuntimeCompositionManifest) => ((source: string) => boolean);
+export declare const externalizeRuntimeComposition: ({ manifest, }: RuntimeCompositionViteOptions) => Plugin;
+export declare const includeRuntimeImportMap: ({ manifest, environment, }: RuntimeCompositionViteOptions) => Plugin;
+export declare const runtimeComposition: (options: RuntimeCompositionViteOptions) => Plugin[];
+export type LocalSliceOverride = {
+    name: string;
+    port: number;
+};
+export declare const buildLocalImportMapScript: (manifest: RuntimeCompositionManifest, localSlice: LocalSliceOverride) => string;
+export type IncludeHostedImportMapOptions = {
+    manifest: RuntimeCompositionManifest;
+    path?: string;
+    localSlice?: LocalSliceOverride;
+};
+export declare const includeHostedImportMap: ({ manifest, path, localSlice, }: IncludeHostedImportMapOptions) => Plugin;
+export { defineSliceBuild, type SliceBuildOptions } from "./slice-build.js";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,0BAA0B,EAC/B,KAAK,kBAAkB,EACxB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,MAAM,CAAC;AAEnC,MAAM,MAAM,6BAA6B,GAAG;IAC1C,QAAQ,EAAE,0BAA0B,CAAC;IACrC,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAC/B,UAAU,0BAA0B,KACnC,CAAC,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAoC,CAAC;AAEpE,eAAO,MAAM,6BAA6B,GAAI,eAE3C,6BAA6B,KAAG,MAwBlC,CAAC;AAEF,eAAO,MAAM,uBAAuB,GAAI,4BAGrC,6BAA6B,KAAG,MAgBjC,CAAC;AAEH,eAAO,MAAM,kBAAkB,GAC7B,SAAS,6BAA6B,KACrC,MAAM,EAYR,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,eAAO,MAAM,yBAAyB,GACpC,UAAU,0BAA0B,EACpC,YAAY,kBAAkB,KAC7B,MAkBF,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG;IAC1C,QAAQ,EAAE,0BAA0B,CAAC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,kBAAkB,CAAC;CACjC,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAAI,iCAIpC,6BAA6B,KAAG,MAmCjC,CAAC;AAEH,OAAO,EAAE,gBAAgB,EAAE,KAAK,iBAAiB,EAAE,MAAM,kBAAkB,CAAC"}

package/dist/index.js ADDED Viewed

@@ -0,0 +1,102 @@
+import { createExternalMatcher, createImportMap, createImportMapBootstrapScript, } from "@rmc-toolkit/core";
+export const createRollupExternal = (manifest) => createExternalMatcher(manifest);
+export const externalizeRuntimeComposition = ({ manifest, }) => {
+    const isExternal = createExternalMatcher(manifest);
+    return {
+        name: "runtime-module-composition-externalize",
+        enforce: "pre",
+        config() {
+            return {
+                optimizeDeps: {
+                    noDiscovery: true,
+                },
+            };
+        },
+        resolveId(source) {
+            if (!isExternal(source)) {
+                return null;
+            }
+            return {
+                id: source,
+                external: true,
+            };
+        },
+    };
+};
+export const includeRuntimeImportMap = ({ manifest, environment = "development", }) => ({
+    name: "runtime-module-composition-include-import-map",
+    transformIndexHtml(html) {
+        const importMap = createImportMap(manifest, { environment });
+        const script = `<script type="importmap" data-runtime-module-composition>${JSON.stringify(importMap)}</script>`;
+        const existingImportMap = /<script[^>]*type=["']importmap["'][^>]*data-runtime-module-composition[^>]*>.*?<\/script>/s;
+        if (existingImportMap.test(html)) {
+            return html.replace(existingImportMap, script);
+        }
+        return html.includes("<head>")
+            ? html.replace("<head>", `<head>\n    ${script}`)
+            : `${script}\n${html}`;
+    },
+});
+export const runtimeComposition = (options) => {
+    const plugins = [];
+    if (options.externalize !== false) {
+        plugins.push(externalizeRuntimeComposition(options));
+    }
+    if (options.includeImportMap !== false) {
+        plugins.push(includeRuntimeImportMap(options));
+    }
+    return plugins;
+};
+export const buildLocalImportMapScript = (manifest, localSlice) => {
+    const derivedManifest = {
+        ...manifest,
+        environments: {
+            ...manifest.environments,
+            development: {
+                ...manifest.environments?.development,
+                sliceOrigins: {
+                    ...manifest.environments?.development?.sliceOrigins,
+                    [localSlice.name]: `http://localhost:${localSlice.port}`,
+                },
+            },
+        },
+    };
+    return createImportMapBootstrapScript(derivedManifest, {
+        environment: "development",
+    });
+};
+export const includeHostedImportMap = ({ manifest, path = "/js/importmap.js", localSlice, }) => ({
+    name: "runtime-module-composition-hosted-import-map",
+    configureServer(server) {
+        server.middlewares.use(path, (req, res, next) => {
+            // Connect (which Vite's dev server middlewares are built on) mounts
+            // handlers by path *prefix*: it matches any request whose pathname
+            // starts with `path` and is followed by end-of-string, "/", or ".",
+            // then strips the matched prefix from `req.url` before invoking the
+            // handler. That means req.url here is *relative to the mount point*,
+            // and a request for "/js/importmap.js.map" or
+            // "/js/importmap.js/anything" also reaches this handler (as
+            // req.url === "/.map" or "/anything"), not just the exact endpoint.
+            // Comparing req.url against the outer `path` would never match,
+            // since Connect has already removed that prefix — the only way to
+            // detect "this is genuinely the exact endpoint" is to check that the
+            // remaining, query-stripped req.url is empty or "/".
+            const method = req.method ?? "GET";
+            if (method !== "GET" && method !== "HEAD") {
+                next();
+                return;
+            }
+            const remainder = (req.url ?? "/").split("?")[0] ?? "/";
+            if (remainder !== "" && remainder !== "/") {
+                next();
+                return;
+            }
+            const script = localSlice
+                ? buildLocalImportMapScript(manifest, localSlice)
+                : createImportMapBootstrapScript(manifest, { environment: "development" });
+            res.setHeader("Content-Type", "text/javascript");
+            res.end(script);
+        });
+    },
+});
+export { defineSliceBuild } from "./slice-build.js";

package/dist/index.test.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=index.test.d.ts.map

package/dist/index.test.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"index.test.d.ts","sourceRoot":"","sources":["../src/index.test.ts"],"names":[],"mappings":""}

package/dist/index.test.js ADDED Viewed

@@ -0,0 +1,169 @@
+import { defineManifest } from "@rmc-toolkit/core";
+import { describe, expect, test } from "vitest";
+import { buildLocalImportMapScript, defineSliceBuild, includeHostedImportMap, includeRuntimeImportMap, runtimeComposition, } from "./index.js";
+const manifest = defineManifest({
+    namespace: "@acme",
+    assetsOrigin: "https://assets.example.com",
+    externalDepsOrigin: "https://esm.sh",
+    environments: {
+        development: {
+            sliceOrigins: {
+                search: "http://localhost:5174",
+            },
+        },
+    },
+});
+describe("vite adapter", () => {
+    test("includes the import map in transformed HTML", () => {
+        const plugin = includeRuntimeImportMap({
+            manifest,
+            environment: "development",
+        });
+        if (typeof plugin.transformIndexHtml !== "function") {
+            throw new TypeError("Expected transformIndexHtml to be a function.");
+        }
+        const transformIndexHtml = plugin.transformIndexHtml;
+        const html = transformIndexHtml("<html><head></head><body></body></html>");
+        expect(html).toContain('<script type="importmap" data-runtime-module-composition>');
+        expect(html).toContain('"@acme/":"https://assets.example.com/"');
+        expect(html).toContain('"@esm.sh/":"https://esm.sh/"');
+        expect(html).toContain('"@acme/search/":"http://localhost:5174/"');
+        expect(html).toContain("</head>");
+    });
+    test("can disable import map HTML generation in the combined plugin list", () => {
+        const plugins = runtimeComposition({
+            manifest,
+            includeImportMap: false,
+        });
+        expect(plugins.map((plugin) => plugin.name)).toEqual([
+            "runtime-module-composition-externalize",
+        ]);
+    });
+    test("re-exports defineSliceBuild from the public barrel", () => {
+        const config = defineSliceBuild({
+            mode: "development",
+            devPort: 5301,
+            entry: "src/index.ts",
+        });
+        expect(config).toEqual({ server: { port: 5301 } });
+    });
+});
+const createMockServer = () => {
+    const middlewares = [];
+    const use = (path, handler) => {
+        middlewares.push({ path, handler });
+    };
+    return { server: { middlewares: { use } }, middlewares };
+};
+describe("includeHostedImportMap", () => {
+    test("buildLocalImportMapScript overrides only the local slice's origin", () => {
+        const script = buildLocalImportMapScript(manifest, {
+            name: "search",
+            port: 5173,
+        });
+        expect(script).toContain('"@acme/search/":"http://localhost:5173/"');
+        expect(script).toContain('"@acme/":"https://assets.example.com/"');
+    });
+    test("serves the generated script from the default middleware path", () => {
+        const plugin = includeHostedImportMap({ manifest });
+        const { server, middlewares } = createMockServer();
+        if (typeof plugin.configureServer !== "function") {
+            throw new TypeError("Expected configureServer to be a function.");
+        }
+        plugin.configureServer(server);
+        expect(middlewares).toHaveLength(1);
+        expect(middlewares[0]?.path).toBe("/js/importmap.js");
+        const headers = {};
+        let body = "";
+        const res = {
+            setHeader: (name, value) => {
+                headers[name] = value;
+            },
+            end: (chunk) => {
+                body = chunk;
+            },
+        };
+        // Connect strips the matched mount path from req.url before invoking the
+        // handler, so an exact match to the mounted path shows up as "/" here.
+        middlewares[0]?.handler({ url: "/", method: "GET" }, res, () => { });
+        expect(headers["Content-Type"]).toBe("text/javascript");
+        expect(body).toContain('"@acme/":"https://assets.example.com/"');
+    });
+    test("uses a custom middleware path when provided", () => {
+        const plugin = includeHostedImportMap({ manifest, path: "/custom.js" });
+        const { server, middlewares } = createMockServer();
+        if (typeof plugin.configureServer !== "function") {
+            throw new TypeError("Expected configureServer to be a function.");
+        }
+        plugin.configureServer(server);
+        expect(middlewares[0]?.path).toBe("/custom.js");
+    });
+    test("applies the localSlice override when serving the script", () => {
+        const plugin = includeHostedImportMap({
+            manifest,
+            localSlice: { name: "search", port: 5173 },
+        });
+        const { server, middlewares } = createMockServer();
+        if (typeof plugin.configureServer !== "function") {
+            throw new TypeError("Expected configureServer to be a function.");
+        }
+        plugin.configureServer(server);
+        let body = "";
+        const res = {
+            setHeader: () => { },
+            end: (chunk) => {
+                body = chunk;
+            },
+        };
+        middlewares[0]?.handler({ url: "/", method: "GET" }, res, () => { });
+        expect(body).toContain('"@acme/search/":"http://localhost:5173/"');
+    });
+    test("calls next() instead of end() for a method other than GET/HEAD", () => {
+        const plugin = includeHostedImportMap({ manifest });
+        const { server, middlewares } = createMockServer();
+        if (typeof plugin.configureServer !== "function") {
+            throw new TypeError("Expected configureServer to be a function.");
+        }
+        plugin.configureServer(server);
+        let nextCalled = false;
+        let endCalled = false;
+        const res = {
+            setHeader: () => { },
+            end: () => {
+                endCalled = true;
+            },
+        };
+        // Exact-path match ("/"), but a POST — should fall through, not respond.
+        middlewares[0]?.handler({ url: "/", method: "POST" }, res, () => {
+            nextCalled = true;
+        });
+        expect(nextCalled).toBe(true);
+        expect(endCalled).toBe(false);
+    });
+    test("calls next() instead of end() when the matched path is a prefix-extended variant", () => {
+        const plugin = includeHostedImportMap({ manifest });
+        const { server, middlewares } = createMockServer();
+        if (typeof plugin.configureServer !== "function") {
+            throw new TypeError("Expected configureServer to be a function.");
+        }
+        plugin.configureServer(server);
+        let nextCalled = false;
+        let endCalled = false;
+        const res = {
+            setHeader: () => { },
+            end: () => {
+                endCalled = true;
+            },
+        };
+        // Connect mounts by prefix and strips the matched portion from req.url,
+        // so "/js/importmap.js.map" and "/js/importmap.js/anything" show up
+        // inside the handler as "/.map" and "/anything" respectively (confirmed
+        // against the real `connect` package that Vite bundles). Neither is the
+        // exact mounted endpoint, so both must fall through via next().
+        middlewares[0]?.handler({ url: "/.map", method: "GET" }, res, () => {
+            nextCalled = true;
+        });
+        expect(nextCalled).toBe(true);
+        expect(endCalled).toBe(false);
+    });
+});

package/dist/slice-build.d.ts ADDED Viewed

@@ -0,0 +1,9 @@
+import type { UserConfig } from "vite";
+export declare const resolveEntry: (cwd: string, entry?: string) => string;
+export type SliceBuildOptions = {
+    mode: string;
+    devPort: number;
+    entry?: string;
+};
+export declare const defineSliceBuild: (options: SliceBuildOptions) => UserConfig;
+//# sourceMappingURL=slice-build.d.ts.map

package/dist/slice-build.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"slice-build.d.ts","sourceRoot":"","sources":["../src/slice-build.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AAEvC,eAAO,MAAM,YAAY,GAAI,KAAK,MAAM,EAAE,QAAQ,MAAM,KAAG,MAgB1D,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,SAAS,iBAAiB,KAAG,UA2B7D,CAAC"}

package/dist/slice-build.js ADDED Viewed

@@ -0,0 +1,40 @@
+import { existsSync } from "node:fs";
+import { join } from "node:path";
+export const resolveEntry = (cwd, entry) => {
+    if (entry !== undefined) {
+        return entry;
+    }
+    if (existsSync(join(cwd, "src/index.tsx"))) {
+        return "src/index.tsx";
+    }
+    if (existsSync(join(cwd, "src/index.ts"))) {
+        return "src/index.ts";
+    }
+    throw new Error("defineSliceBuild: could not find src/index.tsx or src/index.ts. Pass an explicit `entry` option if this slice uses a non-standard layout.");
+};
+export const defineSliceBuild = (options) => {
+    const resolvedEntry = resolveEntry(process.cwd(), options.entry);
+    // Any mode other than "development" (production, or a custom mode) is
+    // treated as a real build and gets the full library-build config below.
+    if (options.mode === "development") {
+        return { server: { port: options.devPort } };
+    }
+    return {
+        preview: { cors: true },
+        // Vite's library-build mode, unlike its app-build mode, doesn't
+        // auto-replace process.env.NODE_ENV, so React/Vue's internal dev/prod
+        // checks left a raw `process` reference in bundles loaded directly via
+        // native import() in the browser, throwing `ReferenceError: process is
+        // not defined` at runtime (no bundler runs afterward to catch it).
+        define: {
+            "process.env.NODE_ENV": JSON.stringify("production"),
+        },
+        build: {
+            lib: {
+                entry: resolvedEntry,
+                formats: ["es"],
+                fileName: () => "index.mjs",
+            },
+        },
+    };
+};

package/dist/slice-build.test.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export {};
2	+ //# sourceMappingURL=slice-build.test.d.ts.map

package/dist/slice-build.test.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"slice-build.test.d.ts","sourceRoot":"","sources":["../src/slice-build.test.ts"],"names":[],"mappings":""}

package/dist/slice-build.test.js ADDED Viewed

@@ -0,0 +1,71 @@
+import { mkdirSync, mkdtempSync, rmSync, writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
+import { afterEach, describe, expect, test } from "vitest";
+import { defineSliceBuild, resolveEntry } from "./slice-build.js";
+let tempDir = null;
+const createTempSliceDir = () => {
+    tempDir = mkdtempSync(join(tmpdir(), "rmc-vite-slice-build-"));
+    return tempDir;
+};
+afterEach(() => {
+    if (tempDir) {
+        rmSync(tempDir, { recursive: true, force: true });
+        tempDir = null;
+    }
+});
+describe("resolveEntry", () => {
+    test("returns the explicit entry without touching the filesystem", () => {
+        const dir = createTempSliceDir();
+        expect(resolveEntry(dir, "custom/entry.ts")).toBe("custom/entry.ts");
+    });
+    test("prefers src/index.tsx when both .tsx and .ts exist", () => {
+        const dir = createTempSliceDir();
+        mkdirSync(join(dir, "src"), { recursive: true });
+        writeFileSync(join(dir, "src", "index.tsx"), "export default {};");
+        writeFileSync(join(dir, "src", "index.ts"), "export default {};");
+        expect(resolveEntry(dir)).toBe("src/index.tsx");
+    });
+    test("falls back to src/index.ts when only it exists", () => {
+        const dir = createTempSliceDir();
+        mkdirSync(join(dir, "src"), { recursive: true });
+        writeFileSync(join(dir, "src", "index.ts"), "export default {};");
+        expect(resolveEntry(dir)).toBe("src/index.ts");
+    });
+    test("throws a clear error when neither conventional path exists", () => {
+        const dir = createTempSliceDir();
+        mkdirSync(join(dir, "src"), { recursive: true });
+        expect(() => resolveEntry(dir)).toThrow("defineSliceBuild: could not find src/index.tsx or src/index.ts. Pass an explicit `entry` option if this slice uses a non-standard layout.");
+    });
+});
+describe("defineSliceBuild", () => {
+    test("dev mode returns only the server port", () => {
+        const config = defineSliceBuild({
+            mode: "development",
+            devPort: 5301,
+            entry: "src/index.tsx",
+        });
+        expect(config).toEqual({ server: { port: 5301 } });
+    });
+    test("build mode returns preview/define/build.lib with the resolved entry", () => {
+        const config = defineSliceBuild({
+            mode: "production",
+            devPort: 5301,
+            entry: "src/index.tsx",
+        });
+        expect(config.preview).toEqual({ cors: true });
+        expect(config.define).toEqual({
+            "process.env.NODE_ENV": JSON.stringify("production"),
+        });
+        const lib = config.build?.lib;
+        if (!lib) {
+            throw new TypeError("Expected config.build.lib to be defined.");
+        }
+        expect(lib.entry).toBe("src/index.tsx");
+        expect(lib.formats).toEqual(["es"]);
+        expect(typeof lib.fileName).toBe("function");
+        if (typeof lib.fileName === "function") {
+            expect(lib.fileName("es", "index")).toBe("index.mjs");
+        }
+    });
+});

package/package.json ADDED Viewed

@@ -0,0 +1,30 @@
+{
+  "name": "@rmc-toolkit/vite",
+  "version": "0.1.0",
+  "type": "module",
+  "main": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "peerDependencies": {
+    "@rmc-toolkit/core": "0.1.0",
+    "vite": ">=5"
+  },
+  "dependencies": {
+    "@rmc-toolkit/core": "0.1.0"
+  },
+  "scripts": {
+    "build": "tsc -b"
+  }
+}