@ideasonpurpose/build-tools-wordpress 2.9.1 → 2.10.0

package/AGENTS.md

@@ -1,6 +1,6 @@
 <!--
 Canonical AGENTS.md: https://gist.github.com/joemaller/d6154fbdb2e5f4670c0b9338d04189e9
-Last Modified: 2026-06-26
+Last Modified: 2026-07-06
 -->
 
 # AI Coding Assistant Guidelines
@@ -35,14 +35,13 @@ Before implementing:
 
 **Minimum code that solves the problem. Nothing speculative.**
 
-- Look for existing solutions in standard libraries and native platform features.
+- Use standard libraries and native platform features first. Suggest popular, well-maintained alternatives. 
 - Prefer boring, obvious code over clever code.
 - No features beyond what was asked.
 - No abstractions for single-use code.
 - Look for solutions in existing dependencies. If different than the first-choice solution, show pros and cons.
 - No "flexibility" or "configurability" that wasn't requested.
 - Only add error handling for realistically possible cases given current scope and style.
-- Ask before introducing new dependencies.
 - If you write 200 lines and it could be 50, rewrite it.
 
 Ask yourself: "Would a senior engineer call this overcomplicated?" If yes, simplify.
@@ -53,33 +52,28 @@ Ask yourself: "Would a senior engineer call this overcomplicated?" If yes, simpl
 
 When editing existing code:
 
-- Preserve the spirit and conventions of the codebase.
+- Preserve the codebase spirit conventions, and style.
 - Don't "improve" adjacent code, comments, or formatting.
-- Don't remove comments or commented-out code unless asked.
+- Don't remove comments or dead code unless asked.
 - Don't refactor code that isn't broken.
-- Match existing style, even if you'd do it differently.
-- If you find dead code, mention it - don't delete it.
-- Never run tests unless explicitly asked.
-- Never run linters or formatters unless asked.
-- Never add code which logs secrets, API keys, tokens, or .env values. If that code exists, say something.
-
-When your changes create orphans:
-
-- Remove imports/variables/functions that _your_ changes made unused.
-- Do not remove pre-existing dead code unless asked.
+- Never run tests, linters or formatters unless asked.
+- Never log secrets, API keys, tokens, or .env values. If that code exists, say something.
+- Remove imports/variables/functions that _your_ changes orphaned.
 
 Every changed line should trace directly to the user's request.
 
+**Security exception**: Allow sweeping changes to fix real security problems. Explain.
+
 ## 4. Documentation and Comments
 
 - Prefer self-documenting code and descriptive names over comments.
 - Add comments only where the _why_ is not obvious from the code.
 - Update or remove comments directly invalidated by your changes.
 - Follow the existing codebase's conventions for types, docstrings, and documentation style.
-- When this file and the system prompt disagree, note the conflict and ask for guidance.
+- Note conflicts with the system prompt and ask for guidance.
 
 ## 5. Additional Instructions
 
 Look for sibling `AGENTS-*.md` files for further instructions on specific concerns (e.g. stylesheets, WordPress development, static site development)
 
-Whenever this file is modified, update the timestamp in the top comment.
+Whenever this file is modified, update the timestamp in the top comment.

package/CHANGELOG.md

@@ -4,6 +4,12 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
+#### v2.9.1
+
+> 26 June 2026
+
+- bump deps, format action
+
 #### v2.9.0
 
 > 26 June 2026

package/README.md

@@ -1,6 +1,6 @@
 # @ideasonpurpose/build-tools-wordpress
 
-#### Version 2.9.1
+#### Version 2.10.0
 
 [![NPM Version](https://img.shields.io/npm/v/%40ideasonpurpose%2Fbuild-tools-wordpress?logo=npm)](https://www.npmjs.com/package/@ideasonpurpose/build-tools-wordpress)
 [![GitHub Actions Workflow Status](https://img.shields.io/github/actions/workflow/status/ideasonpurpose/build-tools-wordpress/npm-publish.yml?logo=github&logoColor=white)](https://github.com/ideasonpurpose/build-tools-wordpress#readme)

package/boilerplate/composer.json

@@ -8,13 +8,14 @@
     }
   ],
   "config": {
+    "discard-changes": "stash",
     "optimize-autoloader": true,
-    "sort-packages": true,
-    "vendor-dir": "wp-content/themes/iop-theme/vendor",
     "platform": {
       "php": "8.4",
       "ext-intl": "0"
-    }
+    },
+    "sort-packages": true,
+    "vendor-dir": "wp-content/themes/iop-theme/vendor"
   },
   "autoload": {
     "psr-4": {

package/config/webpack.config.js

@@ -1,3 +1,5 @@
+// @ts-check
+
 import { posix as path } from "path";
 
 import { statSync } from "fs";
@@ -34,7 +36,7 @@ if (process.env.WEBPACK_BUNDLE_ANALYZER) process.env.NODE_ENV = "production";
 
 const isProduction = process.env.NODE_ENV === "production";
 
-const stats = {
+const __stats = {
   preset: "normal",
   cachedAssets: false,
   assets: true,
@@ -79,6 +81,28 @@ const stats = {
   loggingDebug: ["sass-loader"],
 };
 
+const stats = isProduction
+  ? {
+      preset: "normal",
+      colors: true,
+    }
+  : {
+      all: false,
+      errors: true,
+      warnings: true,
+      errorDetails: false,
+      colors: true,
+      modules: false,
+      assets: false, // ← hides the long asset list on every rebuild
+      entrypoints: false,
+      hash: false,
+      version: false,
+      performance: false,
+      reasons: false,
+      timings: false,
+      children: false,
+      loggingDebug: false, // only enable sass debug when you really need it
+    };
 /**
  * @param {Record<string, any>} env - Environment variables from Webpack CLI
  */
@@ -92,7 +116,6 @@ export default async (env) => {
 
   const proxy = isProduction ? {} : await devserverProxy(config);
 
-
   /**
    * Simple helper for encoding SVGs as data urls with proper encoding for special characters
    * @param {Buffer} content
@@ -121,12 +144,12 @@ export default async (env) => {
 
   const devtool = config.devtool || false;
 
-  // Debug: Log the watchFiles paths
   const watchPath =
     path.resolve(config.src, "..") + "/**/*.{php,html,svg,json}";
-  console.log(chalk.cyan("🔍 Watching files:"), watchPath);
+  console.log(chalk.cyan("🔍"), chalk.bold("Watching:"), watchPath);
   console.log(
-    chalk.cyan("📁 Theme directory:"),
+    chalk.cyan("📁"),
+    chalk.bold("Theme:"),
     path.resolve(config.src, ".."),
   );
 
@@ -323,7 +346,11 @@ export default async (env) => {
       // hot: "only",
       static: [
         { directory: config.dist, watch: false },
-        { directory: config.src, publicPath: config.publicPath.replace('/dist/', '/src/'), watch: false },
+        {
+          directory: config.src,
+          publicPath: config.publicPath.replace("/dist/", "/src/"),
+          watch: false,
+        },
       ],
 
       client: {
@@ -344,7 +371,9 @@ export default async (env) => {
 
       devMiddleware: {
         index: false, // enable root proxying
-
+        infrastructureLogging: {
+          level: "warn", // or "error" for even stricter
+        },
         writeToDisk: (filePath) => {
           // // // SHORT_CIRCUIT FOR TESTING
           // // console.log("DEBUG writeToDisk:", { filePath });
@@ -418,7 +447,11 @@ export default async (env) => {
           devServer.server.address().port;
         devServer.compiler._devServer = devServer;
 
-        console.log("Listening on port:", port);
+        console.log(
+          chalk.cyan("●"),
+          chalk.bold("Listening:"),
+          chalk.blue.underline(`http://localhost:${port}`),
+        );
       },
 
       /**
@@ -435,7 +468,9 @@ export default async (env) => {
          * `/inform` requests with 404s, filling logs and cluttering
          * terminals. So that's why this is here. I hate it.
          */
-        devServer.app.all("/inform", () => false);
+        devServer.app.all("/inform", (req, res) => {
+          res.status(204).end();
+        });
 
         /**
          * The "/webpack/reload" endpoint will trigger a full devServer refresh
@@ -448,7 +483,9 @@ export default async (env) => {
          */
         devServer.app.get("/webpack/reload", (req, res) => {
           console.log(
-            chalk.yellow("Reload triggered by request to /webpack/reload"),
+            chalk.yellow("↻"),
+            chalk.yellow.bold("Reload:"),
+            "/webpack/reload",
           );
 
           devServer.sendMessage(
@@ -529,12 +566,13 @@ export default async (env) => {
         manifestFile: config.manifestFile,
       }),
 
-      new AfterDoneReporterPlugin({
+      new WatchRunReporterPlugin({
         echo: env && env.WEBPACK_SERVE,
-        // message:
-        //   "Dev site " + chalk.blue.bold(`http://localhost:${process.env.PORT}`),
       }),
 
+      new AfterDoneReporterPlugin({
+        echo: env && env.WEBPACK_SERVE,
+      }),
       new BundleAnalyzerPlugin({
         analyzerMode: isProduction ? "static" : "disabled",
         openAnalyzer: false,

package/lib/AfterDoneReporterPlugin.js

@@ -1,78 +1,46 @@
+// @ts-check
+
 import chalk from "chalk";
 import humanizeDuration from "humanize-duration";
 
 /**
- * Simple plugin for printing some text after compilation stats are displayed
- *
- * Messages should be configured in an argument object:
- *
- *    new AfterDoneReporterPlugin({message: "Your Message Here"})
+ * Clean post-compilation summary for dev server.
+ * Shows status, duration, and the local URL without placeholder text or setTimeout hacks.
  */
 export class AfterDoneReporterPlugin {
   constructor(options = {}) {
     const defaults = {
       echo: true,
-      prefix: `🟢${chalk.gray("(iop)")}:`,
-      message: "",
     };
     this.config = { ...defaults, ...options };
-    this.name = "IOP Reporter Plugin";
-    this.messages = [];
+    this.name = "IOP AfterDone Reporter";
   }
 
   apply(compiler) {
-    compiler.hooks.done.tapPromise(this.name, async (stats) => {
-      if (this.config.echo) {
-        /**
-         * NOTE: As of webpack-dev-server vXX.XX.XXX, auto-assigned ports are
-         * not propagated into the compiler.options.devServer object.
-         *
-         * As a workaround, this relies on the following line being added to
-         * the webpack.config file's devServer.setupMiddlewares method:
-         *
-         *    devServer.compiler.options.devServer.port = devServer.options.port;
-         *
-         */
-        const { host, port } = compiler.options.devServer;
-        const { startTime, endTime, modules, assetsInfo } = stats.compilation;
-        const hostname = host === "0.0.0.0" ? "localhost" : host;
-
-        const time = chalk.yellow.bold(
-          humanizeDuration(endTime - startTime, { units: ["h", "m", "s"] }),
-        );
-        const mCount = chalk.yellow(modules.size);
-        const aCount = chalk.yellow.bold(assetsInfo.size);
-
-        const messages = [
-          // `Compiled ${mCount} input modules into ${aCount} files in ${time}`,
-          // "Dev site " + chalk.blue(`http://${hostname}:${chalk.bold(port)}`),
-          "Dev site " + chalk.blue(`http://${hostname}:${chalk.bold(port)}`),
-          this.config.message,
-        ]
-          .filter((m) => m.length)
-          .join("\n" + this.config.prefix + " ");
-
-        setTimeout(() =>
-          // console.log("\n" + this.config.prefix + " " + messages),
-          console.log( "🚧  " + messages),
-        );
-
-        setTimeout(() => {
-          // console.log(Object.keys(compiler));
-          // console.log(compiler.options);
-        });
+    compiler.hooks.done.tap(this.name, (stats) => {
+      if (!this.config.echo) return;
+
+      const devServer = compiler.options.devServer || {};
+      const host = devServer.host === "0.0.0.0" ? "localhost" : devServer.host || "localhost";
+      const port = devServer.port || "auto";
+      const url = chalk.blue.underline(`http://${host}:${port}`);
+
+      const durationMs = stats.endTime && stats.startTime ? stats.endTime - stats.startTime : 0;
+      const time = humanizeDuration(durationMs, { units: ["s", "ms"], round: true });
+
+      const hasErrors = stats.hasErrors();
+      const hasWarnings = stats.hasWarnings();
+
+      let statusLine;
+      if (hasErrors) {
+        statusLine = `${chalk.red.bold("✖ Failed")} in ${chalk.yellow(time)}`;
+      } else if (hasWarnings) {
+        statusLine = `${chalk.yellow.bold("⚠ Compiled with warnings")} in ${chalk.yellow(time)}`;
+      } else {
+        statusLine = `${chalk.green.bold("✔ Compiled")} in ${chalk.yellow(time)}`;
       }
-    });
-
-
-    // compiler.hooks.done.tapPromise("webpack-dev-server", async (stats) => {
-    //   await stats;
-    //   setTimeout(() => {
-    //     console.log(chalk.bold.magenta("in webpack-dev-server hook"), {
-    //       stats, thing: Object.keys( compiler.options),
-    //     });
-    //   });
-    // });
 
+      console.log(`\n${statusLine} → ${url}`);
+    });
   }
-}
+}

package/lib/WatchRunReporterPlugin.js

@@ -1,56 +1,61 @@
+import path from "path";
 import chalk from "chalk";
+
 /**
- * Simple plugin for restoring the starting compile message which vanished in
- * DevServer v4
- *
- * Messages should be configured in an argument object:
+ * Clean file-change reporting for watch/dev mode.
+ * Shows what triggered the recompile without flooding the terminal.
  *
- *    new WatchRunReporterPlugin({message: "Your Message Here"})
+ * Tracks compiler.hooks.invalid to capture the triggering filename,
+ * falling back to compiler.modifiedFiles when available.
  */
 export class WatchRunReporterPlugin {
   constructor(options = {}) {
     const defaults = {
       echo: true,
-      prefix: `🟢${chalk.gray("(iop)")}:`,
-      message: chalk.bold("Compiling...", ""),
+      message: chalk.gray("recompiling..."),
     };
     this.config = { ...defaults, ...options };
-    this.name = "IOP Reporter Plugin";
+    this.name = "IOP WatchRun Reporter";
+    this.invalidFile = null;
   }
 
   apply(compiler) {
-    compiler.hooks.watchRun.tapPromise(this.name, async () => {
-      if (this.config.echo) {
-        /**
-         * compiler.modifiedFiles is a Set containing the changed file or files
-         * along ith the base path containing those files (or the entryPoint?)
-         *
-         * Sorting the set (as an Array) puts the base path first (it's the shortest)
-         * then we remove it from the paths to clean up.
-         *
-         * Report a single changed path or the count of changed paths
-         */
-        let msg = "";
-        if (compiler.modifiedFiles) {
-          let modFiles = Array.from(compiler.modifiedFiles).sort();
-          const basePath = modFiles[0];
-          const basePathPattern = new RegExp(`${basePath}/?`, "gi");
-          modFiles = modFiles
-            .map((p) => p.replace(basePathPattern, ""))
-            .filter((p) => p);
-
-          if (modFiles.length > 1) {
-            msg = `Modified ${modFiles.length - 1} files `;
-          } else {
-            msg = `Modified ${chalk.bold.yellow(modFiles[0] || basePath)} `;
-          }
-        }
-        // console.log(this.config.prefix, msg + this.config.message);
-        // console.clear();
-        if (msg) {
-          console.log("\n💫 ", msg);
-        }
+    compiler.hooks.invalid.tap(this.name, (fileName) => {
+      this.invalidFile = fileName;
+    });
+
+    compiler.hooks.watchRun.tap(this.name, () => {
+      if (!this.config.echo) return;
+
+      const root = compiler.context || process.cwd();
+      const modFiles = compiler.modifiedFiles?.size
+        ? Array.from(compiler.modifiedFiles)
+        : null;
+      const changed =
+        modFiles || (this.invalidFile ? [this.invalidFile] : null);
+
+      this.invalidFile = null;
+
+      if (!changed) return;
+
+      const relFiles = changed
+        .map((p) => path.relative(root, p) || p)
+        .sort();
+
+      let changeMsg;
+      if (relFiles.length === 1) {
+        changeMsg = chalk.bold.yellow(relFiles[0]);
+      } else if (relFiles.length <= 3) {
+        changeMsg = chalk.bold.yellow(relFiles.join(", "));
+      } else {
+        changeMsg = chalk.bold.yellow(
+          `${relFiles.slice(0, 2).join(", ")} +${relFiles.length - 2} more`,
+        );
       }
+
+      console.log(
+        `\n${chalk.cyan("⟳")} Changed: ${changeMsg} ${this.config.message}`,
+      );
     });
   }
-}
+}

package/lib/devserver-proxy.js

@@ -19,13 +19,12 @@ export async function devserverProxy(config) {
   if (config.proxy === true) {
     const localPort = await findLocalPort();
     // console.log({ localPort });
-    if (localPort && localPort.hostname && localPort.port) {
+      if (localPort && localPort.hostname && localPort.port) {
       target = new URL(`http://${localPort.hostname}:${localPort.port}`);
       console.log(
-        chalk.cyan.bold(
-          `PORT FROM DEVSERVER-PROXY: TRUE ${localPort.port}`,
-          // target,
-        ),
+        chalk.cyan("↔"),
+        chalk.bold("Proxy:"),
+        chalk.blue.underline(target.origin),
       );
     }
   } else if (!!isIP(config.proxy)) {
@@ -46,10 +45,11 @@ export async function devserverProxy(config) {
       if (localPort && localPort.hostname && localPort.port) {
         target = new URL(`http://${localPort.hostname}:${localPort.port}`);
         console.log(
-          "PORT FROM DEVSERVER-PROXY:",
+          chalk.cyan("↔"),
+          chalk.bold("Proxy:"),
           chalk.cyan(config.proxy),
-          chalk.bold(localPort.port),
-          // target,
+          "→",
+          chalk.blue.underline(target.origin),
         );
       }
     }
@@ -64,7 +64,6 @@ export async function devserverProxy(config) {
       context: [
         "**",
         "!/ws",
-        "!/sockjs-node",
         "!/__webpack_dev_server__",
         "!/webpack-dev-server",
       ],
@@ -76,84 +75,89 @@ export async function devserverProxy(config) {
       cookieDomainRewrite: "", // was `${config.host}:8080` ??
       headers: { "Accept-Encoding": "identity" },
       ws: true,
-
-      onError: (err, req, res) => {
-        if (err.code === "ECONNRESET") {
-          console.log(chalk.yellow("Caught ECONNRESET error, ignoring..."));
-        } else {
-          console.log("Devserver Proxy Error: ", req.url, err, err.stack);
-          res.writeHead(500, { "Content-Type": "text-plain" });
-          res.end("Webpack DevServer Proxy Error: " + err);
-        }
-      },
-
-      onProxyReqWs: (proxyReq, req, socket, options, head) => {
-        socket.on("error", (err) => {
-          if (err.code !== "EPIPE") {
-            console.error("WebSocket proxy error:", err);
-          }
-        });
-      },
-
-      onProxyRes: function (proxyRes, req, res) {
-        /**
-         * Update urls in files with these content-types
-         */
-        const contentTypes = [
-          "application/javascript",
-          "application/json",
-          "multipart/form-data",
-          "text/css",
-          "text/html",
-          "text/plain",
-        ];
-
-        let originalBody = [];
-
-        proxyRes.on("data", (data) => originalBody.push(data));
-
-        proxyRes.on("end", () => {
-          res.statusCode = proxyRes.statusCode;
-          if (proxyRes.statusMessage) {
-            res.statusMessage = proxyRes.statusMessage;
+      // prevent WDS from injecting its logger (stops per-request [HPM] GET spam)
+      logger: { info: () => {}, warn: () => {}, error: () => {} },
+
+      // http-proxy-middleware v3+ event API (webpack-dev-server v6)
+      on: {
+        error: (err, req, res) => {
+          if (err.code === "ECONNRESET") {
+            console.log(chalk.yellow("Proxy: connection reset, ignoring"));
+          } else {
+            console.log(chalk.red("Proxy error:"), req.url, err, err.stack);
+            res.writeHead(500, { "Content-Type": "text-plain" });
+            res.end("Webpack DevServer Proxy Error: " + err);
           }
+        },
 
-          Object.keys(proxyRes.headers).forEach((key) => {
-            let header = proxyRes.headers[key];
-            if (typeof header == "string") {
-              header = header.replace(
-                new RegExp(target.host, "gi"),
-                req.headers.host,
-              );
+        proxyReqWs: (proxyReq, req, socket, options, head) => {
+          socket.on("error", (err) => {
+            if (err.code !== "EPIPE") {
+              console.error(chalk.red("WebSocket proxy error:"), err);
             }
-            res.setHeader(String(key).trim(), header);
           });
+        },
+
+        proxyRes: function (proxyRes, req, res) {
+          /**
+           * Update urls in files with these content-types
+           */
+          const contentTypes = [
+            "application/javascript",
+            "application/json",
+            "multipart/form-data",
+            "text/css",
+            "text/html",
+            "text/plain",
+          ];
+
+          let originalBody = [];
+
+          proxyRes.on("data", (data) => originalBody.push(data));
+
+          proxyRes.on("end", () => {
+            res.statusCode = proxyRes.statusCode;
+            if (proxyRes.statusMessage) {
+              res.statusMessage = proxyRes.statusMessage;
+            }
 
-          originalBody = Buffer.concat(originalBody);
-          let newBody;
-
-          // const type = proxyRes.headers["content-type"]?.split(";")[0].trim() ?? null;
-          const type = proxyRes.headers["content-type"]?.split(";")[0].trim();
-
-          const wpRegexp = new RegExp(
-            "^/wp-(?:admin|includes|content/plugins).*(?:css|js|map)$",
-          );
-          const originRegExp = new RegExp(
-            `(http:\\\\/\\\\/|http://)${target.host}`,
-            "gi",
-          );
-
-          if (contentTypes.includes(type) && !wpRegexp.test(req.path)) {
-            newBody = originalBody
-              .toString("utf8")
-              .replace(originRegExp, `$1${req.headers.host}`);
-            res.setHeader("Content-Length", Buffer.byteLength(newBody));
-          } else {
-            newBody = originalBody;
-          }
+            Object.keys(proxyRes.headers).forEach((key) => {
+              let header = proxyRes.headers[key];
+              if (typeof header == "string") {
+                header = header.replace(
+                  new RegExp(target.host, "gi"),
+                  req.headers.host,
+                );
+              }
+              res.setHeader(String(key).trim(), header);
+            });
+
+            originalBody = Buffer.concat(originalBody);
+            let newBody;
+
+            // const type = proxyRes.headers["content-type"]?.split(";")[0].trim() ?? null;
+            const type = proxyRes.headers["content-type"]?.split(";")[0].trim();
+
+            const wpRegexp = new RegExp(
+              "^/wp-(?:admin|includes|content/plugins).*(?:css|js|map)$",
+            );
+            const originRegExp = new RegExp(
+              `(http:\\\\/\\\\/|http://)${target.host}`,
+              "gi",
+            );
+
+            if (contentTypes.includes(type) && !wpRegexp.test(req.path)) {
+              newBody = originalBody
+                .toString("utf8")
+                .replace(originRegExp, `$1${req.headers.host}`);
+              res.setHeader("Content-Length", Buffer.byteLength(newBody));
+            } else {
+              newBody = originalBody;
+            }
 
-          res.end(newBody);
-        });
+            res.end(newBody);
+          });
+        },
       },
     },
   ];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ideasonpurpose/build-tools-wordpress",
-  "version": "2.9.1",
+  "version": "2.10.0",
   "description": "Build scripts and dependencies for IOP's WordPress development environments.",
   "homepage": "https://github.com/ideasonpurpose/build-tools-wordpress#readme",
   "bugs": {
@@ -41,38 +41,37 @@
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-node-resolve": "^16.0.3",
     "@svgr/webpack": "^8.1.0",
-    "@wordpress/dependency-extraction-webpack-plugin": "^6.49.0",
+    "@wordpress/dependency-extraction-webpack-plugin": "^6.51.0",
     "ansi-html": "^0.0.9",
     "archiver": "^8.0.0",
-    "autoprefixer": "^10.5.2",
+    "autoprefixer": "^10.5.3",
     "babel-loader": "^10.1.1",
-    "caniuse-lite": "^1.0.30001799",
+    "caniuse-lite": "^1.0.30001805",
     "chalk": "^5.6.2",
     "chalk-cli": "^6.0.0",
     "classnames": "^2.5.1",
-    "cli-truncate": "^6.0.1",
+    "cli-truncate": "^6.1.1",
     "copy-webpack-plugin": "^14.0.0",
     "cosmiconfig": "^9.0.2",
     "css-loader": "^7.1.4",
     "cssnano": "^8.0.2",
     "dotenv": "^17.4.2",
     "esbuild-loader": "^4.5.0",
-    "eslint": "^10.6.0",
-    "filesize": "^11.0.19",
-    "fs-extra": "^11.3.5",
-    "globby": "^16.2.0",
+    "eslint": "^10.7.0",
+    "filesize": "^11.0.22",
+    "fs-extra": "^11.3.6",
+    "globby": "^16.2.1",
     "html-webpack-plugin": "^5.6.7",
-    "http-proxy": "^1.18.1",
-    "humanize-duration": "^3.33.2",
+    "humanize-duration": "^3.34.0",
     "image-minimizer-webpack-plugin": "^5.0.0",
     "is-text-path": "^3.0.0",
     "lodash": "^4.18.1",
     "mini-css-extract-plugin": "^2.10.2",
     "ora": "^9.4.1",
-    "postcss": "^8.5.15",
+    "postcss": "^8.5.19",
     "postcss-loader": "^8.2.1",
     "postcss-scss": "^4.0.9",
-    "prettier": "^3.8.5",
+    "prettier": "^3.9.5",
     "pretty-hrtime": "^1.0.3",
     "read-package-up": "^12.0.0",
     "replacestream": "^4.0.3",
@@ -80,25 +79,27 @@
     "sass-embedded": "^1.100.0",
     "sass-loader": "^17.0.0",
     "semver": "^7.8.5",
-    "sharp": "^0.35.2",
+    "sharp": "^0.35.3",
     "sort-package-json": "^4.0.0",
     "string-length": "^7.0.1",
     "style-loader": "^4.0.0",
-    "svgo": "^4.0.1",
+    "svgo": "^4.0.2",
     "svgo-loader": "^5.0.0",
     "version-everything": "^0.12.2",
-    "webpack": "^5.108.1",
-    "webpack-bundle-analyzer": "^5.3.0",
-    "webpack-dev-middleware": "^8.0.3",
-    "webpack-dev-server": "^5.2.5",
+    "webpack": "^5.108.4",
+    "webpack-bundle-analyzer": "^5.3.1",
+    "webpack-dev-server": "^6.0.0",
     "webpack-manifest-plugin": "^6.0.1"
   },
   "peerDependencies": {
     "webpack-cli": "^6.0.1"
   },
+  "engines": {
+    "node": ">=22.15.0"
+  },
   "devDependencies": {
-    "@vitest/coverage-v8": "^4.1.9",
-    "vitest": "^4.1.9"
+    "@vitest/coverage-v8": "^4.1.10",
+    "vitest": "^4.1.10"
   },
   "version-everything": {
     "files": [
@@ -106,8 +107,8 @@
     ]
   },
   "allowScripts": {
-    "@parcel/watcher@2.5.1": true,
     "esbuild@0.28.1": true,
-    "fsevents@2.3.3": true
+    "fsevents@2.3.3": true,
+    "@parcel/watcher@2.5.6": true
   }
 }

package/test/devserver-proxy.test.js

@@ -82,15 +82,15 @@ test("Proxy boolean false", async () => {
   expect(await devserverProxy({ proxy })).toStrictEqual({ proxy: [] });
 });
 
-test("test the returned proxy onError handler", async () => {
+test("test the returned proxy on.error handler", async () => {
   const logSpy = vi.spyOn(console, "log");
   const actual = await devserverProxy({ proxy: true });
 
   const err = { code: "ECONNRESET" };
 
-  actual.proxy[0].onError(err, "req", "res");
+  actual.proxy[0].on.error(err, "req", "res");
   expect(logSpy).toHaveBeenLastCalledWith(
-    expect.stringContaining("ECONNRESET"),
+    expect.stringContaining("connection reset"),
   );
 
   err.code = "Unknown Error Code";
@@ -99,10 +99,10 @@ test("test the returned proxy onError handler", async () => {
   const req = { url: "url" };
   const res = { writeHead: vi.fn(), end: vi.fn() };
 
-  actual.proxy[0].onError(err, req, res);
+  actual.proxy[0].on.error(err, req, res);
 
   expect(logSpy).toHaveBeenLastCalledWith(
-    expect.stringContaining("Devserver Proxy Error"),
+    expect.stringContaining("Proxy error"),
     req.url,
     expect.any(Object),
     err.stack,
@@ -114,10 +114,10 @@ test("test the returned proxy onError handler", async () => {
   );
 });
 
-test("onProxyRes Handler", async () => {
+test("on.proxyRes Handler", async () => {
   const config = { proxy: "http://localhost:3000" };
   const result = await devserverProxy(config);
-  const onProxyRes = result.proxy[0].onProxyRes;
+  const onProxyRes = result.proxy[0].on.proxyRes;
 
   const mockProxyRes = new EventEmitter();
   mockProxyRes.statusCode = 200;
@@ -152,10 +152,10 @@ test("onProxyRes Handler", async () => {
   );
 });
 
-test("onProxyRes Handler passthrough", async () => {
+test("on.proxyRes Handler passthrough", async () => {
   const config = { proxy: "http://localhost:3000" };
   const result = await devserverProxy(config);
-  const onProxyRes = result.proxy[0].onProxyRes;
+  const onProxyRes = result.proxy[0].on.proxyRes;
 
   const mockProxyRes = new EventEmitter();
   mockProxyRes.statusCode = 200;
@@ -190,9 +190,9 @@ test("onProxyRes Handler passthrough", async () => {
   );
 });
 
-test("onProxyReqWs handler", async () => {
+test("on.proxyReqWs handler", async () => {
   const result = await devserverProxy({ proxy: "http://example.com" });
-  const onProxyReqWs = result.proxy[0].onProxyReqWs;
+  const onProxyReqWs = result.proxy[0].on.proxyReqWs;
 
   const socket = new EventEmitter();
   const errSpy = vi.spyOn(console, "error");
@@ -202,7 +202,8 @@ test("onProxyReqWs handler", async () => {
   expect(errSpy).not.toHaveBeenCalled();
 
   socket.emit("error", { code: "OTHER" });
-  expect(errSpy).toHaveBeenCalledWith("WebSocket proxy error:", {
-    code: "OTHER",
-  });
+  expect(errSpy).toHaveBeenCalledWith(
+    expect.stringContaining("WebSocket proxy error"),
+    { code: "OTHER" },
+  );
 });