mokup 0.2.2 → 1.0.1

package/dist/webpack.d.ts

@@ -0,0 +1,88 @@
+import { MokupViteOptionsInput } from './index.js';
+export { DirectoryConfig, HttpMethod, MockContext, MockMiddleware, MockResponse, MockResponseHandler, MockRule, MokupMockMode, MokupSwOptions, MokupViteOptions } from './index.js';
+import { IncomingMessage, ServerResponse } from 'node:http';
+import '@mokup/shared/hono';
+
+interface WebpackPluginInstance {
+    apply: (compiler: WebpackCompiler) => void;
+}
+interface WebpackDevMiddleware {
+    name?: string;
+    middleware: (req: IncomingMessage, res: ServerResponse, next: (err?: unknown) => void) => void | Promise<void>;
+}
+interface WebpackDevServer {
+    app?: {
+        use: (middleware: WebpackDevMiddleware['middleware']) => void;
+    };
+}
+interface WebpackCompilation {
+    hooks: {
+        processAssets: {
+            tapPromise: (options: {
+                name: string;
+                stage: number;
+            }, handler: () => Promise<void>) => void;
+        };
+    };
+    emitAsset: (name: string, source: {
+        source: () => string;
+    }) => void;
+    updateAsset: (name: string, source: {
+        source: () => string;
+    }) => void;
+    getAsset: (name: string) => unknown;
+    getAssetPath: (name: string, data?: {
+        hash?: string;
+    }) => string;
+    outputOptions: {
+        publicPath?: unknown;
+    };
+    hash?: string;
+}
+interface WebpackCompiler {
+    context?: string;
+    options: {
+        output?: {
+            publicPath?: unknown;
+            assetModuleFilename?: unknown;
+        };
+        devServer?: {
+            setupMiddlewares?: (middlewares: WebpackDevMiddleware[], devServer: WebpackDevServer) => WebpackDevMiddleware[];
+            devMiddleware?: {
+                publicPath?: unknown;
+            };
+        };
+    };
+    hooks: {
+        beforeCompile: {
+            tapPromise: (name: string, handler: () => Promise<void>) => void;
+        };
+        thisCompilation: {
+            tap: (name: string, handler: (compilation: WebpackCompilation) => void) => void;
+        };
+        watchRun: {
+            tap: (name: string, handler: (compiler: WebpackCompiler) => void) => void;
+        };
+        watchClose: {
+            tap: (name: string, handler: () => void) => void;
+        };
+    };
+    watching?: {
+        invalidate: () => void;
+    };
+    webpack: {
+        Compilation: {
+            PROCESS_ASSETS_STAGE_ADDITIONS: number;
+        };
+        sources: {
+            RawSource: new (source: string) => {
+                source: () => string;
+            };
+        };
+    };
+}
+declare function createMokupWebpackPlugin(options?: MokupViteOptionsInput): WebpackPluginInstance;
+
+// @ts-ignore
+export = createMokupWebpackPlugin;
+export { MokupViteOptionsInput, createMokupWebpackPlugin };

package/dist/webpack.mjs

@@ -0,0 +1,442 @@
+import { createRequire } from 'node:module';
+import { cwd } from 'node:process';
+import chokidar from '@mokup/shared/chokidar';
+import { build } from '@mokup/shared/esbuild';
+import { isAbsolute, resolve } from '@mokup/shared/pathe';
+import { r as resolvePlaygroundOptions, a as resolveSwConfig, b as resolveSwUnregisterConfig, c as createPlaygroundMiddleware, e as createLogger, f as createMiddleware, i as isInDirs, g as createDebouncer, h as resolveDirs, s as scanRoutes, j as sortRoutes, k as createHonoApp, d as buildSwScript, t as toPosix } from './shared/mokup.C6zZ8YEh.mjs';
+import 'node:buffer';
+import '@mokup/shared/hono';
+import 'node:fs';
+import 'node:url';
+import '@mokup/shared/jsonc-parser';
+import '@mokup/runtime';
+
+const pluginName = "mokup:webpack";
+const lifecycleBaseName = "mokup-sw-lifecycle.js";
+function normalizeOptions(options) {
+  const list = Array.isArray(options) ? options : [options];
+  return list.length > 0 ? list : [{}];
+}
+function resolvePlaygroundInput(list) {
+  for (const entry of list) {
+    if (typeof entry.playground !== "undefined") {
+      return entry.playground;
+    }
+  }
+  return void 0;
+}
+function normalizeBase(base) {
+  if (!base) {
+    return "/";
+  }
+  if (base.startsWith(".")) {
+    return "/";
+  }
+  let normalized = base.startsWith("/") ? base : `/${base}`;
+  if (!normalized.endsWith("/")) {
+    normalized = `${normalized}/`;
+  }
+  return normalized;
+}
+function resolveRegisterPath(base, path) {
+  const normalizedBase = normalizeBase(base);
+  const normalizedPath = path.startsWith("/") ? path : `/${path}`;
+  if (normalizedPath.startsWith(normalizedBase)) {
+    return normalizedPath;
+  }
+  return `${normalizedBase}${normalizedPath.slice(1)}`;
+}
+function resolveRegisterScope(base, scope) {
+  const normalizedBase = normalizeBase(base);
+  const normalizedScope = scope.startsWith("/") ? scope : `/${scope}`;
+  if (normalizedScope.startsWith(normalizedBase)) {
+    return normalizedScope;
+  }
+  return `${normalizedBase}${normalizedScope.slice(1)}`;
+}
+function isAbsoluteUrl(value) {
+  return /^https?:\/\//.test(value);
+}
+function resolveBaseFromPublicPath(publicPath) {
+  if (typeof publicPath !== "string") {
+    return "/";
+  }
+  if (!publicPath || publicPath === "auto") {
+    return "/";
+  }
+  if (isAbsoluteUrl(publicPath)) {
+    return "/";
+  }
+  return normalizeBase(publicPath);
+}
+function resolveAssetsDir(assetModuleFilename) {
+  if (typeof assetModuleFilename !== "string") {
+    return "assets";
+  }
+  const normalized = assetModuleFilename.replace(/\\/g, "/");
+  const prefix = normalized.split("/")[0] ?? "";
+  if (!prefix || prefix.includes("[")) {
+    return "assets";
+  }
+  return prefix;
+}
+function joinPublicPath(publicPath, fileName) {
+  if (!publicPath) {
+    return fileName;
+  }
+  const normalized = publicPath.endsWith("/") ? publicPath : `${publicPath}/`;
+  return `${normalized}${fileName}`;
+}
+function buildSwLifecycleScript(params) {
+  const { base, importPath, swConfig, unregisterConfig, hasSwEntries, hasSwRoutes } = params;
+  const shouldUnregister = unregisterConfig.unregister === true || !hasSwEntries;
+  if (shouldUnregister) {
+    const path2 = resolveRegisterPath(base, unregisterConfig.path);
+    const scope2 = resolveRegisterScope(base, unregisterConfig.scope);
+    return [
+      `import { unregisterMokupServiceWorker } from ${JSON.stringify(importPath)}`,
+      "(async () => {",
+      `  await unregisterMokupServiceWorker({ path: ${JSON.stringify(path2)}, scope: ${JSON.stringify(scope2)} })`,
+      "})()"
+    ].join("\n");
+  }
+  if (!swConfig || swConfig.register === false) {
+    return null;
+  }
+  if (!hasSwRoutes) {
+    return null;
+  }
+  const path = resolveRegisterPath(base, swConfig.path);
+  const scope = resolveRegisterScope(base, swConfig.scope);
+  return [
+    `import { registerMokupServiceWorker } from ${JSON.stringify(importPath)}`,
+    "(async () => {",
+    `  const registration = await registerMokupServiceWorker({ path: ${JSON.stringify(path)}, scope: ${JSON.stringify(scope)} })`,
+    "  if (import.meta.hot && registration) {",
+    "    import.meta.hot.on('mokup:routes-changed', () => {",
+    "      registration.update()",
+    "    })",
+    "  }",
+    "})()"
+  ].join("\n");
+}
+function resolveModuleFilePath(file, root) {
+  const absolute = isAbsolute(file) ? file : resolve(root, file);
+  const normalized = toPosix(absolute);
+  if (/^[a-z]:\//i.test(normalized)) {
+    return `file:///${normalized}`;
+  }
+  return normalized;
+}
+async function bundleScript(params) {
+  const result = await build({
+    stdin: {
+      contents: params.code,
+      resolveDir: params.root,
+      sourcefile: params.sourceName,
+      loader: "js"
+    },
+    absWorkingDir: params.root,
+    bundle: true,
+    platform: "browser",
+    format: "esm",
+    target: "es2020",
+    write: false
+  });
+  return result.outputFiles[0]?.text ?? "";
+}
+const require$1 = createRequire(import.meta.url);
+function resolveHtmlWebpackPlugin() {
+  try {
+    const mod = require$1("html-webpack-plugin");
+    const plugin = mod.default ?? mod;
+    return plugin;
+  } catch {
+    return null;
+  }
+}
+function createMokupWebpackPlugin(options = {}) {
+  const optionList = normalizeOptions(options);
+  const logEnabled = optionList.every((entry) => entry.log !== false);
+  const watchEnabled = optionList.every((entry) => entry.watch !== false);
+  const playgroundConfig = resolvePlaygroundOptions(resolvePlaygroundInput(optionList));
+  const logger = createLogger(logEnabled);
+  const hasSwEntries = optionList.some((entry) => entry.mode === "sw");
+  const swConfig = resolveSwConfig(optionList, logger);
+  const unregisterConfig = resolveSwUnregisterConfig(optionList, logger);
+  let root = cwd();
+  let base = "/";
+  let assetsDir = "assets";
+  let routes = [];
+  let serverRoutes = [];
+  let swRoutes = [];
+  let app = null;
+  let watcher = null;
+  let watchingCompiler = null;
+  let swLifecycleBundle = null;
+  let swBundle = null;
+  let swLifecycleFileName = `${assetsDir}/${lifecycleBaseName}`;
+  let warnedHtml = false;
+  let buildPromise = null;
+  const resolveAllDirs = () => {
+    const dirs = [];
+    const seen = /* @__PURE__ */ new Set();
+    for (const entry of optionList) {
+      for (const dir of resolveDirs(entry.dir, root)) {
+        if (seen.has(dir)) {
+          continue;
+        }
+        seen.add(dir);
+        dirs.push(dir);
+      }
+    }
+    return dirs;
+  };
+  const hasSwRoutes = () => !!swConfig && swRoutes.length > 0;
+  const refreshRoutes = async () => {
+    const collected = [];
+    const collectedServer = [];
+    const collectedSw = [];
+    for (const entry of optionList) {
+      const dirs = resolveDirs(entry.dir, root);
+      const scanParams = {
+        dirs,
+        prefix: entry.prefix ?? "",
+        logger
+      };
+      if (entry.include) {
+        scanParams.include = entry.include;
+      }
+      if (entry.exclude) {
+        scanParams.exclude = entry.exclude;
+      }
+      const scanned = await scanRoutes(scanParams);
+      collected.push(...scanned);
+      if (entry.mode === "sw") {
+        collectedSw.push(...scanned);
+        if (entry.sw?.fallback !== false) {
+          collectedServer.push(...scanned);
+        }
+      } else {
+        collectedServer.push(...scanned);
+      }
+    }
+    routes = sortRoutes(collected);
+    serverRoutes = sortRoutes(collectedServer);
+    swRoutes = sortRoutes(collectedSw);
+    app = serverRoutes.length > 0 ? createHonoApp(serverRoutes) : null;
+  };
+  const rebuildBundles = async () => {
+    const lifecycle = buildSwLifecycleScript({
+      base,
+      importPath: "mokup/sw",
+      swConfig,
+      unregisterConfig,
+      hasSwEntries,
+      hasSwRoutes: hasSwRoutes()
+    });
+    swLifecycleBundle = lifecycle ? await bundleScript({
+      code: lifecycle,
+      root,
+      sourceName: lifecycleBaseName
+    }) : null;
+    if (swConfig && hasSwRoutes()) {
+      const swScript = buildSwScript({
+        routes: swRoutes,
+        root,
+        runtimeImportPath: "mokup/runtime",
+        basePaths: swConfig.basePaths ?? [],
+        resolveModulePath: resolveModuleFilePath
+      });
+      swBundle = await bundleScript({
+        code: swScript,
+        root,
+        sourceName: "mokup-sw.js"
+      });
+    } else {
+      swBundle = null;
+    }
+  };
+  const ensureBuilt = async () => {
+    if (!buildPromise) {
+      buildPromise = (async () => {
+        await refreshRoutes();
+        await rebuildBundles();
+      })().catch((error) => {
+        logger.error("Failed to build mokup bundles:", error);
+      }).finally(() => {
+        buildPromise = null;
+      });
+    }
+    await buildPromise;
+  };
+  const playgroundMiddleware = createPlaygroundMiddleware({
+    getRoutes: () => routes,
+    config: playgroundConfig,
+    logger,
+    getDirs: () => resolveAllDirs(),
+    getServer: () => ({ config: { base, root } })
+  });
+  const swMiddleware = async (req, res, next) => {
+    if (!swConfig || !hasSwRoutes()) {
+      return next();
+    }
+    const requestUrl = req.url ?? "/";
+    const parsed = new URL(requestUrl, "http://mokup.local");
+    const swPath = resolveRegisterPath(base, swConfig.path);
+    if (parsed.pathname !== swPath) {
+      return next();
+    }
+    await ensureBuilt();
+    if (!swBundle) {
+      res.statusCode = 500;
+      res.setHeader("Content-Type", "text/plain; charset=utf-8");
+      res.end("Failed to generate mokup service worker.");
+      return;
+    }
+    res.statusCode = 200;
+    res.setHeader("Content-Type", "application/javascript; charset=utf-8");
+    res.setHeader("Cache-Control", "no-cache");
+    res.end(swBundle);
+  };
+  const mockMiddleware = createMiddleware(() => app, logger);
+  return {
+    apply(compiler) {
+      root = compiler.context ?? cwd();
+      assetsDir = resolveAssetsDir(compiler.options.output?.assetModuleFilename);
+      swLifecycleFileName = `${assetsDir}/${lifecycleBaseName}`;
+      base = resolveBaseFromPublicPath(compiler.options.output?.publicPath);
+      compiler.hooks.watchRun.tap(pluginName, (active) => {
+        watchingCompiler = active;
+      });
+      compiler.hooks.beforeCompile.tapPromise(pluginName, async () => {
+        const devPublicPath = compiler.options.devServer?.devMiddleware?.publicPath;
+        base = resolveBaseFromPublicPath(devPublicPath ?? compiler.options.output?.publicPath);
+        await ensureBuilt();
+      });
+      compiler.hooks.thisCompilation.tap(pluginName, (compilation) => {
+        const HtmlWebpackPlugin = resolveHtmlWebpackPlugin();
+        if (HtmlWebpackPlugin) {
+          const hooks = HtmlWebpackPlugin.getHooks(compilation);
+          const injectTag = () => {
+            if (!swLifecycleBundle) {
+              return;
+            }
+            const tagBase = {
+              tagName: "script",
+              voidTag: false,
+              attributes: {
+                type: "module"
+              },
+              meta: { plugin: pluginName }
+            };
+            if ("alterAssetTagGroups" in hooks && hooks.alterAssetTagGroups) {
+              hooks.alterAssetTagGroups.tap(pluginName, (data) => {
+                const src = joinPublicPath(data.publicPath ?? "", swLifecycleFileName);
+                data.headTags.unshift({
+                  ...tagBase,
+                  attributes: {
+                    ...tagBase.attributes,
+                    src
+                  }
+                });
+              });
+              return;
+            }
+            if ("alterAssetTags" in hooks && hooks.alterAssetTags) {
+              hooks.alterAssetTags.tap(pluginName, (data) => {
+                const src = joinPublicPath(data.publicPath ?? "", swLifecycleFileName);
+                data.assetTags.scripts.unshift({
+                  ...tagBase,
+                  attributes: {
+                    ...tagBase.attributes,
+                    src
+                  }
+                });
+              });
+            }
+          };
+          injectTag();
+        } else if (!warnedHtml) {
+          warnedHtml = true;
+          logger.warn("html-webpack-plugin not found; skip SW lifecycle injection.");
+        }
+        compilation.hooks.processAssets.tapPromise(
+          { name: pluginName, stage: compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONS },
+          async () => {
+            await ensureBuilt();
+            if (swLifecycleBundle) {
+              const RawSource = compiler.webpack.sources.RawSource;
+              const source = new RawSource(swLifecycleBundle);
+              if (compilation.getAsset(swLifecycleFileName)) {
+                compilation.updateAsset(swLifecycleFileName, source);
+              } else {
+                compilation.emitAsset(swLifecycleFileName, source);
+              }
+            }
+            if (swBundle && swConfig) {
+              const fileName = swConfig.path.startsWith("/") ? swConfig.path.slice(1) : swConfig.path;
+              const RawSource = compiler.webpack.sources.RawSource;
+              const source = new RawSource(swBundle);
+              if (compilation.getAsset(fileName)) {
+                compilation.updateAsset(fileName, source);
+              } else {
+                compilation.emitAsset(fileName, source);
+              }
+            }
+          }
+        );
+      });
+      const devServer = compiler.options.devServer;
+      if (devServer) {
+        const originalSetup = devServer.setupMiddlewares;
+        devServer.setupMiddlewares = (middlewares, server) => {
+          const devPublicPath = compiler.options.devServer?.devMiddleware?.publicPath;
+          base = resolveBaseFromPublicPath(devPublicPath ?? compiler.options.output?.publicPath);
+          void ensureBuilt();
+          const resolved = originalSetup ? originalSetup(middlewares, server) ?? middlewares : middlewares;
+          resolved.unshift(
+            { name: "mokup-playground", middleware: playgroundMiddleware },
+            { name: "mokup-sw", middleware: swMiddleware },
+            { name: "mokup-mock", middleware: mockMiddleware }
+          );
+          if (!watcher && watchEnabled) {
+            const dirs = resolveAllDirs();
+            watcher = chokidar.watch(dirs, { ignoreInitial: true });
+            const scheduleRefresh = createDebouncer(80, () => {
+              void refreshRoutes().then(rebuildBundles).then(() => {
+                if (watchingCompiler?.watching) {
+                  watchingCompiler.watching.invalidate();
+                }
+              }).catch((error) => {
+                logger.error("Failed to refresh mokup routes:", error);
+              });
+            });
+            watcher.on("add", (file) => {
+              if (isInDirs(file, dirs)) {
+                scheduleRefresh();
+              }
+            });
+            watcher.on("change", (file) => {
+              if (isInDirs(file, dirs)) {
+                scheduleRefresh();
+              }
+            });
+            watcher.on("unlink", (file) => {
+              if (isInDirs(file, dirs)) {
+                scheduleRefresh();
+              }
+            });
+          }
+          return resolved;
+        };
+      }
+      compiler.hooks.watchClose.tap(pluginName, () => {
+        watcher?.close();
+        watcher = null;
+      });
+    }
+  };
+}
+
+export { createMokupWebpackPlugin, createMokupWebpackPlugin as default };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "mokup",
   "type": "module",
-  "version": "0.2.2",
+  "version": "1.0.1",
   "description": "Mock utilities and Vite plugin for mokup.",
   "license": "MIT",
   "homepage": "https://mokup.icebreaker.top",
@@ -36,6 +36,11 @@
       "import": "./dist/vite.mjs",
       "require": "./dist/vite.cjs"
     },
+    "./webpack": {
+      "types": "./dist/webpack.d.ts",
+      "import": "./dist/webpack.mjs",
+      "require": "./dist/webpack.cjs"
+    },
     "./runtime": {
       "types": "./dist/runtime.d.ts",
       "import": "./dist/runtime.mjs",
@@ -60,18 +65,27 @@
     "dist"
   ],
   "peerDependencies": {
-    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0"
+    "html-webpack-plugin": "^5.0.0",
+    "vite": "^5.0.0 || ^6.0.0 || ^7.0.0",
+    "webpack": "^5.0.0"
+  },
+  "peerDependenciesMeta": {
+    "html-webpack-plugin": {
+      "optional": true
+    },
+    "vite": {
+      "optional": true
+    },
+    "webpack": {
+      "optional": true
+    }
   },
   "dependencies": {
-    "chokidar": "^5.0.0",
-    "esbuild": "^0.27.2",
-    "hono": "^4.11.4",
-    "jsonc-parser": "^3.3.1",
-    "pathe": "^2.0.3",
-    "@mokup/playground": "0.0.4",
-    "@mokup/server": "0.0.2",
-    "@mokup/cli": "0.2.0",
-    "@mokup/runtime": "0.1.0"
+    "@mokup/cli": "0.3.1",
+    "@mokup/playground": "0.0.5",
+    "@mokup/runtime": "0.1.1",
+    "@mokup/server": "1.0.1",
+    "@mokup/shared": "0.1.0"
   },
   "devDependencies": {
     "@types/node": "^25.0.9",