@rspack/plugin-react-refresh 1.6.2 → 2.0.0-beta.0

package/dist/index.js

@@ -1,82 +1,27 @@
-"use strict";
-var __webpack_require__ = {};
-(()=>{
-    __webpack_require__.n = (module)=>{
-        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
-        __webpack_require__.d(getter, {
-            a: getter
-        });
-        return getter;
-    };
-})();
-(()=>{
-    __webpack_require__.d = (exports1, definition)=>{
-        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
-            enumerable: true,
-            get: definition[key]
-        });
-    };
-})();
-(()=>{
-    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
-})();
-(()=>{
-    __webpack_require__.r = (exports1)=>{
-        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
-            value: 'Module'
-        });
-        Object.defineProperty(exports1, '__esModule', {
-            value: true
-        });
-    };
-})();
-var __webpack_exports__ = {};
-__webpack_require__.r(__webpack_exports__);
-__webpack_require__.d(__webpack_exports__, {
-    ReactRefreshRspackPlugin: ()=>ReactRefreshRspackPlugin,
-    default: ()=>src
-});
-const external_node_path_namespaceObject = require("node:path");
-var external_node_path_default = /*#__PURE__*/ __webpack_require__.n(external_node_path_namespaceObject);
+import { createRequire } from "node:module";
+import node_path from "node:path";
 const d = (object, property, defaultValue)=>{
     if (void 0 === object[property] && void 0 !== defaultValue) object[property] = defaultValue;
     return object[property];
 };
-const normalizeOverlay = (options)=>{
-    const defaultOverlay = {
-        entry: external_node_path_default().join(__dirname, '../client/errorOverlayEntry.js'),
-        module: external_node_path_default().join(__dirname, '../client/overlay/index.js'),
-        sockIntegration: 'wds'
-    };
-    if (!options) return false;
-    if (void 0 === options || true === options) return defaultOverlay;
-    options.entry = options.entry ?? defaultOverlay.entry;
-    options.module = options.module ?? defaultOverlay.module;
-    options.sockIntegration = options.sockIntegration ?? defaultOverlay.sockIntegration;
-    return options;
-};
 function normalizeOptions(options) {
+    d(options, 'test', /\.(?:js|jsx|mjs|cjs|ts|tsx|mts|cts)$/);
     d(options, 'exclude', /node_modules/i);
-    d(options, 'include', /\.([cm]js|[jt]sx?|flow)$/i);
     d(options, 'library');
     d(options, 'forceEnable', false);
     d(options, 'injectLoader', true);
     d(options, 'injectEntry', true);
     d(options, 'reloadOnRuntimeErrors', false);
     d(options, 'reactRefreshLoader', 'builtin:react-refresh-loader');
-    options.overlay = normalizeOverlay(options.overlay);
     return options;
 }
-const reactRefreshPath = external_node_path_default().join(__dirname, '../client/reactRefresh.js');
-const reactRefreshEntryPath = external_node_path_default().join(__dirname, '../client/reactRefreshEntry.js');
-const refreshUtilsPath = external_node_path_default().join(__dirname, '../client/refreshUtils.js');
+const reactRefreshPath = node_path.join(import.meta.dirname, '../client/reactRefresh.js');
+const reactRefreshEntryPath = node_path.join(import.meta.dirname, '../client/reactRefreshEntry.js');
+const refreshUtilsPath = node_path.join(import.meta.dirname, '../client/refreshUtils.js');
+const paths_require = createRequire(import.meta.url);
 let refreshRuntimeDirPath;
 function getRefreshRuntimeDirPath() {
-    if (!refreshRuntimeDirPath) refreshRuntimeDirPath = external_node_path_default().dirname(require.resolve('react-refresh', {
-        paths: [
-            reactRefreshPath
-        ]
-    }));
+    if (!refreshRuntimeDirPath) refreshRuntimeDirPath = node_path.dirname(paths_require.resolve('react-refresh/runtime'));
     return refreshRuntimeDirPath;
 }
 const getRefreshRuntimePaths = ()=>[
@@ -85,115 +30,20 @@ const getRefreshRuntimePaths = ()=>[
         refreshUtilsPath,
         getRefreshRuntimeDirPath()
     ];
-const external_node_querystring_namespaceObject = require("node:querystring");
-var external_node_querystring_default = /*#__PURE__*/ __webpack_require__.n(external_node_querystring_namespaceObject);
-function getAdditionalEntries({ devServer, options }) {
-    const resourceQuery = {};
-    if (devServer) {
-        const { client, https, http2, sockHost, sockPath, sockPort } = devServer;
-        let { host, path, port } = devServer;
-        let protocol = https || http2 ? 'https' : 'http';
-        if (sockHost) host = sockHost;
-        if (sockPath) path = sockPath;
-        if (sockPort) port = sockPort;
-        if (client && null != client.webSocketURL) {
-            let parsedUrl = client.webSocketURL;
-            if ('string' == typeof parsedUrl) parsedUrl = new URL(parsedUrl);
-            let auth;
-            if (parsedUrl.username) {
-                auth = parsedUrl.username;
-                if (parsedUrl.password) auth += `:${parsedUrl.password}`;
-            }
-            if (null != parsedUrl.hostname) host = [
-                null != auth && auth,
-                parsedUrl.hostname
-            ].filter(Boolean).join('@');
-            if (null != parsedUrl.pathname) path = parsedUrl.pathname;
-            if (null != parsedUrl.port) port = [
-                '0',
-                'auto'
-            ].includes(String(parsedUrl.port)) ? void 0 : parsedUrl.port;
-            if (null != parsedUrl.protocol) protocol = 'auto' !== parsedUrl.protocol ? parsedUrl.protocol.replace(':', '') : 'ws';
-        }
-        if (host) resourceQuery.sockHost = host;
-        if (path) resourceQuery.sockPath = path;
-        if (port) resourceQuery.sockPort = port;
-        resourceQuery.sockProtocol = protocol;
-    }
-    if (options.overlay) {
-        const { sockHost, sockPath, sockPort, sockProtocol } = options.overlay;
-        if (sockHost) resourceQuery.sockHost = sockHost;
-        if (sockPath) resourceQuery.sockPath = sockPath;
-        if (sockPort) resourceQuery.sockPort = sockPort;
-        if (sockProtocol) resourceQuery.sockProtocol = sockProtocol;
-    }
-    const queryString = external_node_querystring_default().stringify(resourceQuery, void 0, void 0, {
-        encodeURIComponent (str) {
-            return str;
-        }
-    });
-    const prependEntries = [
-        reactRefreshEntryPath
-    ];
-    const overlayEntries = [
-        false !== options.overlay && options.overlay?.entry && `${require.resolve(options.overlay.entry)}${queryString ? `?${queryString}` : ''}`
-    ].filter(Boolean);
-    return {
-        prependEntries,
-        overlayEntries
-    };
-}
-function getIntegrationEntry(integrationType) {
-    let resolvedEntry;
-    switch(integrationType){
-        case 'whm':
-            resolvedEntry = 'webpack-hot-middleware/client';
-            break;
-    }
-    return resolvedEntry;
-}
-function getSocketIntegration(integrationType) {
-    let resolvedSocketIntegration;
-    switch(integrationType){
-        case 'wds':
-            resolvedSocketIntegration = external_node_path_default().join(__dirname, './sockets/WDSSocket.js');
-            break;
-        case 'whm':
-            resolvedSocketIntegration = external_node_path_default().join(__dirname, './sockets/WHMEventSource.js');
-            break;
-        default:
-            resolvedSocketIntegration = require.resolve(integrationType);
-            break;
-    }
-    return resolvedSocketIntegration;
-}
 function addEntry(entry, compiler) {
     new compiler.rspack.EntryPlugin(compiler.context, entry, {
         name: void 0
     }).apply(compiler);
 }
-function addSocketEntry(sockIntegration, compiler) {
-    const integrationEntry = getIntegrationEntry(sockIntegration);
-    if (integrationEntry) addEntry(integrationEntry, compiler);
-}
 const PLUGIN_NAME = 'ReactRefreshRspackPlugin';
 class ReactRefreshRspackPlugin {
     options;
-    static get deprecated_runtimePaths() {
-        return getRefreshRuntimePaths();
-    }
     constructor(options = {}){
         this.options = normalizeOptions(options);
     }
     apply(compiler) {
         if (('development' !== compiler.options.mode || process.env.NODE_ENV && 'production' === process.env.NODE_ENV) && !this.options.forceEnable) return;
-        const addEntries = getAdditionalEntries({
-            devServer: compiler.options.devServer,
-            options: this.options
-        });
-        if (this.options.injectEntry) for (const entry of addEntries.prependEntries)addEntry(entry, compiler);
-        if (false !== this.options.overlay && this.options.overlay.sockIntegration) addSocketEntry(this.options.overlay.sockIntegration, compiler);
-        for (const entry of addEntries.overlayEntries)addEntry(entry, compiler);
+        if (this.options.injectEntry) addEntry(reactRefreshEntryPath, compiler);
         new compiler.rspack.ProvidePlugin({
             $ReactRefreshRuntime$: reactRefreshPath
         }).apply(compiler);
@@ -223,13 +73,6 @@ class ReactRefreshRspackPlugin {
         const providedModules = {
             __react_refresh_utils__: refreshUtilsPath
         };
-        if (false === this.options.overlay) {
-            definedModules.__react_refresh_error_overlay__ = false;
-            definedModules.__react_refresh_socket__ = false;
-        } else {
-            if (this.options.overlay.module) providedModules.__react_refresh_error_overlay__ = require.resolve(this.options.overlay.module);
-            if (this.options.overlay.sockIntegration) providedModules.__react_refresh_socket__ = getSocketIntegration(this.options.overlay.sockIntegration);
-        }
         new compiler.rspack.DefinePlugin(definedModules).apply(compiler);
         new compiler.rspack.ProvidePlugin(providedModules).apply(compiler);
         compiler.options.resolve.alias = {
@@ -243,13 +86,4 @@ class ReactRefreshRspackPlugin {
         });
     }
 }
-const src = ReactRefreshRspackPlugin;
-exports.ReactRefreshRspackPlugin = __webpack_exports__.ReactRefreshRspackPlugin;
-exports["default"] = __webpack_exports__["default"];
-for(var __rspack_i in __webpack_exports__)if (-1 === [
-    "ReactRefreshRspackPlugin",
-    "default"
-].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});
+export { ReactRefreshRspackPlugin };

package/dist/options.d.ts

@@ -1,19 +1,10 @@
 import type { RuleSetCondition } from '@rspack/core';
-import type { IntegrationType } from './utils/getSocketIntegration';
-interface OverlayOptions {
-    entry: string;
-    module: string;
-    sockIntegration: IntegrationType | false;
-    sockHost?: string;
-    sockPath?: string;
-    sockPort?: string;
-    sockProtocol?: string;
-}
 export type PluginOptions = {
     /**
      * Specifies which files should be processed by the React Refresh loader.
      * This option is passed to the `builtin:react-refresh-loader` as the `rule.test` condition.
      * Works identically to Rspack's `rule.test` option.
+     * @default /\.(?:js|jsx|mjs|cjs|ts|tsx|mts|cts)$/
      * @see https://rspack.rs/config/module-rules#rulestest
      */
     test?: RuleSetCondition;
@@ -22,7 +13,7 @@ export type PluginOptions = {
      * This option is passed to the `builtin:react-refresh-loader` as the `rule.include` condition.
      * Use this to limit processing to specific directories or file patterns.
      * Works identically to Rspack's `rule.include` option.
-     * @default /\.([cm]js|[jt]sx?|flow)$/i
+     * @default undefined
      * @see https://rspack.rs/config/module-rules#rulesinclude
      */
     include?: RuleSetCondition | null;
@@ -60,11 +51,6 @@ export type PluginOptions = {
      * @default false
      */
     forceEnable?: boolean;
-    /**
-     * Modify the behavior of the error overlay.
-     * @default false
-     */
-    overlay?: boolean | Partial<OverlayOptions>;
     /**
      * Whether to inject the builtin:react-refresh-loader
      * @default true
@@ -86,8 +72,5 @@ export type PluginOptions = {
      */
     reactRefreshLoader?: string;
 };
-export interface NormalizedPluginOptions extends Required<PluginOptions> {
-    overlay: false | OverlayOptions;
-}
+export type NormalizedPluginOptions = Required<PluginOptions>;
 export declare function normalizeOptions(options: PluginOptions): NormalizedPluginOptions;
-export {};

package/package.json

@@ -1,76 +1,60 @@
 {
   "name": "@rspack/plugin-react-refresh",
-  "version": "1.6.2",
+  "version": "2.0.0-beta.0",
   "repository": "https://github.com/rstackjs/rspack-plugin-react-refresh",
   "license": "MIT",
   "description": "React refresh plugin for Rspack",
-  "main": "exports/index.cjs",
-  "type": "commonjs",
-  "types": "exports/index.d.cts",
+  "type": "module",
+  "types": "./dist/index.d.ts",
   "exports": {
     ".": {
-      "require": "./exports/index.cjs",
-      "default": "./exports/index.mjs"
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
     },
     "./react-refresh": "./client/reactRefresh.js",
     "./react-refresh-entry": "./client/reactRefreshEntry.js",
-    "./overlay": "./client/overlay/index.js",
     "./package.json": "./package.json"
   },
+  "scripts": {
+    "build": "rslib",
+    "dev": "rslib -w",
+    "lint": "rslint && prettier -c .",
+    "lint:write": "rslint --fix && prettier -w .",
+    "prepare": "simple-git-hooks && npm run build",
+    "test": "rstest",
+    "release": "node ./scripts/release.js",
+    "bump": "npx bumpp --no-push --no-tag --no-commit"
+  },
   "files": [
     "client",
-    "dist",
-    "exports"
+    "dist"
   ],
   "simple-git-hooks": {
-    "pre-commit": "npx nano-staged"
-  },
-  "nano-staged": {
-    "*.{js,jsx,ts,tsx,mjs,cjs}": [
-      "biome check --write --no-errors-on-unmatched"
-    ]
+    "pre-commit": "pnpm run lint:write"
   },
   "devDependencies": {
-    "@biomejs/biome": "^1.9.4",
     "@rslib/core": "^0.20.3",
+    "@rslint/core": "^0.3.4",
     "@rspack/core": "2.0.0-rc.0",
     "@rstest/core": "^0.9.6",
     "@types/node": "^24.12.2",
-    "bumpp": "^11.0.1",
-    "cac": "^7.0.0",
-    "cross-env": "^10.1.0",
-    "execa": "9.6.1",
-    "fs-extra": "11.3.4",
-    "nano-staged": "^0.9.0",
+    "prettier": "^3.8.1",
     "react-refresh": "^0.18.0",
-    "semver": "7.7.4",
     "simple-git-hooks": "^2.13.1",
-    "ts-node": "^10.9.2",
     "typescript": "^6.0.2"
   },
-  "dependencies": {
-    "error-stack-parser": "^2.1.4"
-  },
   "peerDependencies": {
-    "react-refresh": ">=0.10.0 <1.0.0",
-    "webpack-hot-middleware": "2.x"
+    "@rspack/core": "^2.0.0-0",
+    "react-refresh": ">=0.10.0 <1.0.0"
   },
   "peerDependenciesMeta": {
-    "webpack-hot-middleware": {
+    "@rspack/core": {
       "optional": true
     }
   },
+  "packageManager": "pnpm@10.33.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
-  },
-  "scripts": {
-    "build": "rslib",
-    "dev": "rslib -w",
-    "lint": "biome check .",
-    "lint:write": "biome check . --write",
-    "test": "rstest",
-    "release": "node ./scripts/release.mjs",
-    "bump": "npx bumpp --no-push --no-tag --no-commit"
   }
-}
+}

package/client/errorOverlayEntry.js

@@ -1,101 +0,0 @@
-/* global __react_refresh_error_overlay__, __react_refresh_socket__, __resourceQuery */
-const events = require('./utils/errorEventHandlers.js');
-const formatWebpackErrors = require('./utils/formatWebpackErrors.js');
-const runWithRetry = require('./utils/retry.js');
-
-// Setup error states
-let isHotReload = false;
-let hasRuntimeErrors = false;
-
-/**
- * Try dismissing the compile error overlay.
- * This will also reset runtime error records (if any),
- * because we have new source to evaluate.
- * @returns {void}
- */
-function tryDismissErrorOverlay() {
-  __react_refresh_error_overlay__.clearCompileError();
-  __react_refresh_error_overlay__.clearRuntimeErrors(!hasRuntimeErrors);
-  hasRuntimeErrors = false;
-}
-
-/**
- * A function called after a compile success signal is received from Webpack.
- * @returns {void}
- */
-function handleCompileSuccess() {
-  isHotReload = true;
-
-  if (isHotReload) {
-    tryDismissErrorOverlay();
-  }
-}
-
-/**
- * A function called after a compile errored signal is received from Webpack.
- * @param {string[]} errors
- * @returns {void}
- */
-function handleCompileErrors(errors) {
-  isHotReload = true;
-
-  const formattedErrors = formatWebpackErrors(errors);
-
-  // Only show the first error
-  __react_refresh_error_overlay__.showCompileError(formattedErrors[0]);
-}
-
-/**
- * Handles compilation messages from Webpack.
- * Integrates with a compile error overlay.
- * @param {*} message A Webpack HMR message sent via WebSockets.
- * @returns {void}
- */
-function compileMessageHandler(message) {
-  switch (message.type) {
-    case 'ok':
-    case 'still-ok':
-    case 'warnings': {
-      // TODO: Implement handling for warnings
-      handleCompileSuccess();
-      break;
-    }
-    case 'errors': {
-      handleCompileErrors(message.data);
-      break;
-    }
-    default: {
-      // Do nothing.
-    }
-  }
-}
-
-if (process.env.NODE_ENV !== 'production') {
-  if (typeof window !== 'undefined') {
-    function setupOverlay() {
-      // Only register if no other overlay have been registered
-      if (!window.__reactRefreshOverlayInjected && __react_refresh_socket__) {
-        // Registers handlers for compile errors with retry -
-        // This is to prevent mismatching injection order causing errors to be thrown
-        runWithRetry(function initSocket() {
-          __react_refresh_socket__.init(compileMessageHandler, __resourceQuery);
-        }, 3);
-        // Registers handlers for runtime errors
-        events.handleError(function handleError(error) {
-          hasRuntimeErrors = true;
-          __react_refresh_error_overlay__.handleRuntimeError(error);
-        });
-        events.handleUnhandledRejection(
-          function handleUnhandledPromiseRejection(error) {
-            hasRuntimeErrors = true;
-            __react_refresh_error_overlay__.handleRuntimeError(error);
-          },
-        );
-
-        // Mark overlay as injected to prevent double-injection
-        window.__reactRefreshOverlayInjected = true;
-      }
-    }
-    setupOverlay();
-  }
-}

package/client/overlay/components/CompileErrorTrace.js

@@ -1,68 +0,0 @@
-const ansiHTML = require('../../utils/ansi-html.js');
-const theme = require('../theme.js');
-const utils = require('../utils.js');
-
-ansiHTML.setColors(theme);
-
-/**
- * Escape text before passing it to `ansiHTML`, which injects HTML markup.
- * @param {string} value
- * @returns {string}
- */
-function escapeHtml(value) {
-  return value
-    .replace(/&/g, '&')
-    .replace(/</g, '&lt;')
-    .replace(/>/g, '&gt;')
-    .replace(/"/g, '&quot;')
-    .replace(/'/g, '&#39;');
-}
-
-/**
- * @typedef {Object} CompileErrorTraceProps
- * @property {string} errorMessage
- */
-
-/**
- * A formatter that turns Webpack compile error messages into highlighted HTML source traces.
- * @param {Document} document
- * @param {HTMLElement} root
- * @param {CompileErrorTraceProps} props
- * @returns {void}
- */
-function CompileErrorTrace(document, root, props) {
-  const errorParts = props.errorMessage.split('\n');
-  if (errorParts.length) {
-    if (errorParts[0]) {
-      errorParts[0] = utils.formatFilename(errorParts[0]);
-    }
-
-    const errorMessage = errorParts.splice(1, 1)[0];
-    if (errorMessage) {
-      // Strip filename from the error message
-      errorParts.unshift(errorMessage.replace(/^(.*:)\s.*:(\s.*)$/, '$1$2'));
-    }
-  }
-
-  const stackContainer = document.createElement('pre');
-  stackContainer.innerHTML = ansiHTML(escapeHtml(errorParts.join('\n')));
-  stackContainer.style.fontFamily = [
-    '"Operator Mono SSm"',
-    '"Operator Mono"',
-    '"Fira Code Retina"',
-    '"Fira Code"',
-    '"FiraCode-Retina"',
-    '"Andale Mono"',
-    '"Lucida Console"',
-    'Menlo',
-    'Consolas',
-    'Monaco',
-    'monospace',
-  ].join(', ');
-  stackContainer.style.margin = '0';
-  stackContainer.style.whiteSpace = 'pre-wrap';
-
-  root.appendChild(stackContainer);
-}
-
-module.exports = CompileErrorTrace;

package/client/overlay/components/PageHeader.js

@@ -1,60 +0,0 @@
-const Spacer = require('./Spacer.js');
-const theme = require('../theme.js');
-
-/**
- * @typedef {Object} PageHeaderProps
- * @property {string} [message]
- * @property {string} title
- * @property {string} [topOffset]
- */
-
-/**
- * The header of the overlay.
- * @param {Document} document
- * @param {HTMLElement} root
- * @param {PageHeaderProps} props
- * @returns {void}
- */
-function PageHeader(document, root, props) {
-  const pageHeaderContainer = document.createElement('div');
-  pageHeaderContainer.style.background = '#' + theme.dimgrey;
-  pageHeaderContainer.style.boxShadow = '0 1px 4px rgba(0, 0, 0, 0.3)';
-  pageHeaderContainer.style.color = '#' + theme.white;
-  pageHeaderContainer.style.left = '0';
-  pageHeaderContainer.style.right = '0';
-  pageHeaderContainer.style.padding = '1rem 1.5rem';
-  pageHeaderContainer.style.paddingLeft =
-    'max(1.5rem, env(safe-area-inset-left))';
-  pageHeaderContainer.style.paddingRight =
-    'max(1.5rem, env(safe-area-inset-right))';
-  pageHeaderContainer.style.position = 'fixed';
-  pageHeaderContainer.style.top = props.topOffset || '0';
-
-  const title = document.createElement('h3');
-  title.innerText = props.title;
-  title.style.color = '#' + theme.red;
-  title.style.fontSize = '1.125rem';
-  title.style.lineHeight = '1.3';
-  title.style.margin = '0';
-  pageHeaderContainer.appendChild(title);
-
-  if (props.message) {
-    title.style.margin = '0 0 0.5rem';
-
-    const message = document.createElement('span');
-    message.innerText = props.message;
-    message.style.color = '#' + theme.white;
-    message.style.wordBreak = 'break-word';
-    pageHeaderContainer.appendChild(message);
-  }
-
-  root.appendChild(pageHeaderContainer);
-
-  // This has to run after appending elements to root
-  // because we need to actual mounted height.
-  Spacer(document, root, {
-    space: pageHeaderContainer.offsetHeight.toString(10),
-  });
-}
-
-module.exports = PageHeader;