@inkandswitch/patchwork 0.3.0 → 0.3.2

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @inkandswitch/patchwork
 
+## 0.3.2
+
+### Patch Changes
+
+- 5fbc712: Prebundle development import-map dependencies so dynamically loaded packages share module singletons and receive Vite's CommonJS interop.
+
+## 0.3.1
+
+### Patch Changes
+
+- 896fa22: Resolve built-in import-map packages through Vite during development so the site and dynamically loaded tools share module singletons.
+
 ## 0.3.0
 
 ### Minor Changes

package/dist/vite/importmap-plugin.js

@@ -37,11 +37,32 @@ function createImportMap(options) {
     Object.assign(importmap.imports, builtins);
     return { importmap, builtins };
 }
+function devDependencyId(id) {
+    if (id === "@inkandswitch/patchwork")
+        return id;
+    if (id === "@inkandswitch/patchwork-bootloader") {
+        return `@inkandswitch/patchwork > ${id}`;
+    }
+    return `@inkandswitch/patchwork > @inkandswitch/patchwork-bootloader > ${id}`;
+}
 export function importmap(options) {
     const { importmap, builtins } = createImportMap(options);
+    let serve = false;
     return {
         name: "@patchwork/vite",
+        config() {
+            return {
+                optimizeDeps: {
+                    include: Object.keys(builtins).map(devDependencyId),
+                },
+            };
+        },
+        configResolved(config) {
+            serve = config.command === "serve";
+        },
         async buildStart() {
+            if (serve)
+                return;
             for (const [id, fileName] of Object.entries(builtins)) {
                 this.emitFile({
                     type: "chunk",
@@ -66,14 +87,20 @@ export function importmap(options) {
         },
         transformIndexHtml: {
             order: "pre",
-            handler(html) {
+            handler(html, context) {
+                const activeImportmap = structuredClone(importmap);
+                if (context.server) {
+                    for (const id of Object.keys(builtins)) {
+                        activeImportmap.imports[id] = `/@id/${devDependencyId(id)}`;
+                    }
+                }
                 return {
                     html,
                     tags: [
                         {
                             tag: "script",
                             attrs: { type: "importmap" },
-                            children: JSON.stringify(importmap, null, 2),
+                            children: JSON.stringify(activeImportmap, null, 2),
                         },
                     ],
                 };

package/package.json

@@ -5,7 +5,7 @@
     "url": "git+https://github.com/inkandswitch/patchwork-system.git",
     "directory": "core/patchwork"
   },
-  "version": "0.3.0",
+  "version": "0.3.2",
   "author": "Ink & Switch",
   "type": "module",
   "license": "MIT",
@@ -43,10 +43,10 @@
     "sharp": "^0.35.3",
     "vite-plugin-wasm": "^3.6.0",
     "@inkandswitch/patchwork-bootloader": "^0.5.3",
-    "@inkandswitch/patchwork-elements": "^5.0.0",
-    "@inkandswitch/patchwork-plugins": "^1.1.0",
     "@inkandswitch/patchwork-filesystem": "^0.2.5",
-    "@inkandswitch/patchwork-providers": "^0.4.2"
+    "@inkandswitch/patchwork-providers": "^0.4.2",
+    "@inkandswitch/patchwork-plugins": "^1.1.0",
+    "@inkandswitch/patchwork-elements": "^5.0.0"
   },
   "devDependencies": {
     "esbuild": "^0.23.1",

package/src/vite/importmap-plugin.ts

@@ -65,11 +65,31 @@ function createImportMap(options?: PatchworkVitePluginOptions) {
   return { importmap, builtins };
 }
 
+function devDependencyId(id: string): string {
+  if (id === "@inkandswitch/patchwork") return id;
+  if (id === "@inkandswitch/patchwork-bootloader") {
+    return `@inkandswitch/patchwork > ${id}`;
+  }
+  return `@inkandswitch/patchwork > @inkandswitch/patchwork-bootloader > ${id}`;
+}
+
 export function importmap(options?: PatchworkVitePluginOptions): Plugin {
   const { importmap, builtins } = createImportMap(options);
+  let serve = false;
   return {
     name: "@patchwork/vite",
+    config() {
+      return {
+        optimizeDeps: {
+          include: Object.keys(builtins).map(devDependencyId),
+        },
+      };
+    },
+    configResolved(config) {
+      serve = config.command === "serve";
+    },
     async buildStart() {
+      if (serve) return;
       for (const [id, fileName] of Object.entries(builtins)) {
         this.emitFile({
           type: "chunk",
@@ -95,14 +115,20 @@ export function importmap(options?: PatchworkVitePluginOptions): Plugin {
     },
     transformIndexHtml: {
       order: "pre",
-      handler(html) {
+      handler(html, context) {
+        const activeImportmap = structuredClone(importmap);
+        if (context.server) {
+          for (const id of Object.keys(builtins)) {
+            activeImportmap.imports[id] = `/@id/${devDependencyId(id)}`;
+          }
+        }
         return {
           html,
           tags: [
             {
               tag: "script",
               attrs: { type: "importmap" },
-              children: JSON.stringify(importmap, null, 2),
+              children: JSON.stringify(activeImportmap, null, 2),
             },
           ],
         };