@rsbuild/core 0.5.5 → 0.5.7

package/dist/cli/commands.js

@@ -39,7 +39,7 @@ const applyServerOptions = (command) => {
   command.option("-o --open [url]", "open the page in browser on startup").option("--port <port>", "specify a port number for server to listen").option("--host <host>", "specify the host that the server listens to");
 };
 function runCli() {
-  import_commander.program.name("rsbuild").usage("<command> [options]").version("0.5.5");
+  import_commander.program.name("rsbuild").usage("<command> [options]").version("0.5.7");
   const devCommand = import_commander.program.command("dev");
   const buildCommand = import_commander.program.command("build");
   const previewCommand = import_commander.program.command("preview");

package/dist/cli/prepare.js

@@ -34,7 +34,7 @@ function prepareCli() {
   if (!npm_execpath || npm_execpath.includes("npx-cli.js") || npm_execpath.includes(".bun")) {
     console.log();
   }
-  import_rslog.logger.greet(`  ${`Rsbuild v${"0.5.5"}`}
+  import_rslog.logger.greet(`  ${`Rsbuild v${"0.5.7"}`}
 `);
 }
 // Annotate the CommonJS export names for ESM import in node:

package/dist/client/hmr.mjs

@@ -64,19 +64,18 @@ function _construct(Parent, args, Class) {
     }
     return _construct.apply(null, arguments);
 }
-function _defineProperties(target, props) {
-    for(var i = 0; i < props.length; i++){
-        var descriptor = props[i];
-        descriptor.enumerable = descriptor.enumerable || false;
-        descriptor.configurable = true;
-        if ("value" in descriptor) descriptor.writable = true;
-        Object.defineProperty(target, descriptor.key, descriptor);
+function _define_property(obj, key, value) {
+    if (key in obj) {
+        Object.defineProperty(obj, key, {
+            value: value,
+            enumerable: true,
+            configurable: true,
+            writable: true
+        });
+    } else {
+        obj[key] = value;
     }
-}
-function _create_class(Constructor, protoProps, staticProps) {
-    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-    if (staticProps) _defineProperties(Constructor, staticProps);
-    return Constructor;
+    return obj;
 }
 function _get_prototype_of(o) {
     _get_prototype_of = Object.setPrototypeOf ? Object.getPrototypeOf : function getPrototypeOf(o) {
@@ -447,7 +446,7 @@ function linkedText(root, selector, text) {
     var frag = text.slice(curIndex);
     el.appendChild(document.createTextNode(frag));
 }
-var overlayTemplate = '\n<style>\n.root {\n  position: fixed;\n  z-index: 9999;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  overflow-y: scroll;\n  margin: 0;\n  background: rgba(0, 0, 0, 0.66);\n  cursor: pointer;\n}\n\n.container {\n  font-family: Menlo, Consolas, monospace;\n  line-height: 1.6;\n  width: 800px;\n  max-width: 85%;\n  color: #d8d8d8;\n  margin: 32px auto;\n  padding: 32px 40px 42px;\n  position: relative;\n  background: #181818;\n  border-radius: 24px;\n  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);\n  overflow: hidden;\n  direction: ltr;\n  text-align: left;\n  box-sizing: border-box;\n  cursor: default;\n}\n\n.title {\n  margin: 0 0 20px;\n  padding-bottom: 12px;\n  font-size: 17px;\n  font-weight: 600;\n  color: #fc5e5e;\n  border-bottom: 2px solid rgba(252, 94, 94, 0.7);\n}\n\n.content {\n  margin: 0;\n  font-size: 14px;\n  font-family: inherit;\n  overflow-x: scroll;\n  scrollbar-width: none;\n  color: #b8b8b8;\n}\n.content::-webkit-scrollbar {\n  display: none;\n}\n\n.file-link {\n  cursor: pointer;\n  color: #27caca;\n  text-decoration: underline;\n\n  &:hover {\n    opacity: 0.8;\n  }\n  &:active {\n    opacity: 0.6;\n  }\n}\n\n.close {\n  position: absolute;\n  top: 27px;\n  right: 32px;\n  width: 32px;\n  height: 32px;\n  cursor: pointer;\n}\n.close:hover {\n  opacity: 0.8;\n}\n.close:active {\n  opacity: 0.6;\n}\n.close:before,\n.close:after {\n  position: absolute;\n  left: 16px;\n  top: 8px;\n  content: \' \';\n  height: 18px;\n  width: 2px;\n  border-radius: 4px;\n  background-color: #b8b8b8;\n}\n.close:before {\n  transform: rotate(45deg);\n}\n.close:after {\n  transform: rotate(-45deg);\n}\n</style>\n\n<div class="root">\n  <div class="container">\n    <div class="close"></div>\n    <p class="title">Compilation failed</p>\n    <pre class="content"></pre>\n  </div>\n</div>\n';
+var overlayTemplate = '\n<style>\n.root {\n  position: fixed;\n  z-index: 9999;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  overflow-y: scroll;\n  margin: 0;\n  background: rgba(0, 0, 0, 0.66);\n  cursor: pointer;\n}\n.container {\n  font-family: Menlo, Consolas, monospace;\n  line-height: 1.6;\n  width: 800px;\n  max-width: 85%;\n  color: #d8d8d8;\n  margin: 32px auto;\n  padding: 32px 40px;\n  position: relative;\n  background: #181818;\n  border-radius: 24px;\n  box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);\n  overflow: hidden;\n  direction: ltr;\n  text-align: left;\n  box-sizing: border-box;\n  cursor: default;\n}\n.title {\n  margin: 0 0 20px;\n  padding-bottom: 12px;\n  font-size: 17px;\n  font-weight: 600;\n  color: #fc5e5e;\n  border-bottom: 2px solid rgba(252,94,94,.66);\n}\n.content {\n  margin: 0;\n  font-size: 14px;\n  font-family: inherit;\n  overflow-x: scroll;\n  scrollbar-width: none;\n  color: #b8b8b8;\n}\n.content::-webkit-scrollbar {\n  display: none;\n}\n.file-link {\n  cursor: pointer;\n  color: #27caca;\n  text-decoration: underline;\n  &:hover {\n    opacity: 0.8;\n  }\n  &:active {\n    opacity: 0.6;\n  }\n}\n.close {\n  position: absolute;\n  top: 27px;\n  right: 32px;\n  width: 32px;\n  height: 32px;\n  cursor: pointer;\n}\n.close:hover {\n  opacity: 0.8;\n}\n.close:active {\n  opacity: 0.6;\n}\n.close:before,\n.close:after {\n  position: absolute;\n  left: 16px;\n  top: 8px;\n  content: \' \';\n  height: 18px;\n  width: 2px;\n  border-radius: 4px;\n  background-color: #b8b8b8;\n}\n.close:before {\n  transform: rotate(45deg);\n}\n.close:after {\n  transform: rotate(-45deg);\n}\n.footer {\n  font-size: 12px;\n  color: #7e6a92;\n  margin-top: 20px;\n  padding-top: 12px;\n  border-top: 2px solid rgba(126,106,146,.6);\n}\n.footer p {\n  margin: 4px 0 0;\n}\n.footer span {\n  color: #a88dc3;\n}\n</style>\n\n<div class="root">\n  <div class="container">\n    <div class="close"></div>\n    <p class="title">Compilation failed</p>\n    <pre class="content"></pre>\n    <footer class="footer">\n      <p><span>Fix error</span>, click outside, or press Esc to close the overlay.</p>\n      <p>Disable overlay by setting Rsbuild\'s <span>dev.client.overlay</span> config to false.<p>\n    </footer>\n  </div>\n</div>\n';
 var _globalThis_HTMLElement = globalThis.HTMLElement, HTMLElement = _globalThis_HTMLElement === void 0 ? function HTMLElement() {
     "use strict";
     _class_call_check(this, HTMLElement);
@@ -459,9 +458,31 @@ var ErrorOverlay = /*#__PURE__*/ function(HTMLElement) {
     function ErrorOverlay(message) {
         _class_call_check(this, ErrorOverlay);
         var _this;
+        var _root_querySelector;
         _this = _super.call(this);
+        _define_property(_assert_this_initialized(_this), "close", function() {
+            var remove = function() {
+                var _this_parentNode;
+                return (_this_parentNode = _this.parentNode) === null || _this_parentNode === void 0 ? void 0 : _this_parentNode.removeChild(_assert_this_initialized(_this));
+            };
+            if (_this.animate) {
+                _this.animate([
+                    {
+                        opacity: 1
+                    },
+                    {
+                        opacity: 0
+                    }
+                ], {
+                    duration: 300,
+                    easing: "ease-out"
+                }).addEventListener("finish", remove);
+            } else {
+                remove();
+            }
+        });
         if (!_this.attachShadow) {
-            console.warn("The current browser version does not support displaying rsbuild overlay");
+            console.warn("[Rsbuild] Current browser version does not support displaying error overlay");
             return _possible_constructor_return(_this);
         }
         var root = _this.attachShadow({
@@ -469,26 +490,20 @@ var ErrorOverlay = /*#__PURE__*/ function(HTMLElement) {
         });
         root.innerHTML = overlayTemplate;
         linkedText(root, ".content", stripAnsi(message.join("/n")).trim());
-        root.querySelector(".close").addEventListener("click", function() {
-            _this.close();
-        });
-        _this.addEventListener("click", function() {
-            _this.close();
-        });
+        (_root_querySelector = root.querySelector(".close")) === null || _root_querySelector === void 0 ? void 0 : _root_querySelector.addEventListener("click", _this.close);
+        _this.addEventListener("click", _this.close);
         root.querySelector(".container").addEventListener("click", function(e) {
             e.stopPropagation();
         });
+        var onEscKeydown = function(e) {
+            if (e.key === "Escape" || e.code === "Escape") {
+                _this.close();
+            }
+            document.removeEventListener("keydown", onEscKeydown);
+        };
+        document.addEventListener("keydown", onEscKeydown);
         return _this;
     }
-    _create_class(ErrorOverlay, [
-        {
-            key: "close",
-            value: function close() {
-                var _this_parentNode;
-                (_this_parentNode = this.parentNode) === null || _this_parentNode === void 0 ? void 0 : _this_parentNode.removeChild(this);
-            }
-        }
-    ]);
     return ErrorOverlay;
 }(_wrap_native_super(HTMLElement));
 var overlayId = "rsbuild-error-overlay";
@@ -498,7 +513,7 @@ if (customElements && !customElements.get(overlayId)) {
 var documentAvailable = typeof document !== "undefined";
 function createOverlay(err) {
     if (!documentAvailable) {
-        console.info("Failed to display Rsbuild overlay since document is not available, considering turning off the `dev.client.overlay` option.");
+        console.info("[Rsbuild] Failed to display error overlay as document is not available, you can disable the `dev.client.overlay` option.");
         return;
     }
     clearOverlay();

package/dist/index.js

@@ -38,7 +38,7 @@ var import_config = require("./config");
 var import_shared = require("@rsbuild/shared");
 var import_mergeConfig = require("./mergeConfig");
 var import_constants = require("./constants");
-const version = "0.5.5";
+const version = "0.5.7";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   PLUGIN_CSS_NAME,

package/dist/provider/createContext.js

@@ -44,7 +44,7 @@ async function createContextByConfig(options, bundlerType, config = {}) {
   const context = {
     entry: (0, import_entry.getEntryObject)(config, "web"),
     targets: config.output?.targets || [],
-    version: "0.5.5",
+    version: "0.5.7",
     rootPath,
     distPath,
     cachePath,

package/dist/provider/initPlugins.js

@@ -22,6 +22,7 @@ __export(initPlugins_exports, {
   getPluginAPI: () => getPluginAPI
 });
 module.exports = __toCommonJS(initPlugins_exports);
+var import_node_path = require("node:path");
 var import_shared = require("@rsbuild/shared");
 var import_createContext = require("./createContext");
 function getHTMLPathByEntry(entryName, config) {
@@ -29,6 +30,23 @@ function getHTMLPathByEntry(entryName, config) {
   const filename = config.html.outputStructure === "flat" ? `${entryName}.html` : `${entryName}/index.html`;
   return (0, import_shared.removeLeadingSlash)(`${htmlPath}/${filename}`);
 }
+function applyTransformPlugin(chain, transformer) {
+  const name = "RsbuildTransformPlugin";
+  if (chain.plugins.get(name)) {
+    return;
+  }
+  class RsbuildTransformPlugin {
+    apply(compiler) {
+      compiler.__rsbuildTransformer = transformer;
+      compiler.hooks.thisCompilation.tap(name, (compilation) => {
+        compilation.hooks.childCompiler.tap(name, (childCompiler) => {
+          childCompiler.__rsbuildTransformer = transformer;
+        });
+      });
+    }
+  }
+  chain.plugin(name).use(RsbuildTransformPlugin);
+}
 function getPluginAPI({
   context,
   pluginManager
@@ -63,11 +81,38 @@ function getPluginAPI({
       {}
     );
   };
+  const exposed = [];
+  const expose = (id, api) => {
+    exposed.push({ id, api });
+  };
+  const useExposed = (id) => {
+    const matched = exposed.find((item) => item.id === id);
+    if (matched) {
+      return matched.api;
+    }
+  };
+  let transformId = 0;
+  const transformer = {};
+  const transform = (descriptor, handler) => {
+    const id = `rsbuild-transform-${transformId++}`;
+    transformer[id] = handler;
+    hooks.modifyBundlerChain.tap((chain) => {
+      const rule = chain.module.rule(id);
+      if (descriptor.test) {
+        rule.test(descriptor.test);
+      }
+      rule.use(id).loader((0, import_node_path.join)(__dirname, "../rspack/transformLoader")).options({ id });
+      applyTransformPlugin(chain, transformer);
+    });
+  };
   (0, import_shared.onExitProcess)(() => {
     hooks.onExit.call();
   });
   return {
     context: publicContext,
+    expose,
+    transform,
+    useExposed,
     getHTMLPaths,
     getRsbuildConfig,
     getNormalizedConfig,

package/dist/rspack/transformLoader.d.ts

@@ -0,0 +1,5 @@
+import type { LoaderContext } from '@rspack/core';
+import type { RspackSourceMap } from '@rsbuild/shared';
+export default function transform(this: LoaderContext<{
+    id: string;
+}>, source: string, map?: string | RspackSourceMap): Promise<void>;

package/dist/rspack/transformLoader.js

@@ -0,0 +1,51 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var transformLoader_exports = {};
+__export(transformLoader_exports, {
+  default: () => transform
+});
+module.exports = __toCommonJS(transformLoader_exports);
+async function transform(source, map) {
+  const callback = this.async();
+  const bypass = () => callback(null, source, map);
+  const transformId = this.getOptions().id;
+  if (!transformId) {
+    return bypass();
+  }
+  const transform2 = this._compiler?.__rsbuildTransformer?.[transformId];
+  if (!transform2) {
+    return bypass();
+  }
+  const result = await transform2({
+    code: source,
+    resource: this.resource,
+    resourcePath: this.resourcePath,
+    resourceQuery: this.resourceQuery,
+    addDependency: this.addDependency
+  });
+  if (result === null || result === void 0) {
+    return bypass();
+  }
+  if (typeof result === "string") {
+    return callback(null, result, map);
+  }
+  const useMap = map !== void 0 && map !== null;
+  const finalMap = result.map ?? map;
+  callback(null, result.code, useMap ? finalMap : void 0);
+}

package/dist/types.d.ts

@@ -1,5 +1,10 @@
-import type { RsbuildConfig, RsbuildPlugin, RsbuildPlugins, RsbuildContext, NormalizedConfig, RsbuildPluginAPI } from '@rsbuild/shared';
+import type { RsbuildConfig, RsbuildPlugin, RsbuildPlugins, RsbuildContext, NormalizedConfig, RsbuildPluginAPI, TransformHandler } from '@rsbuild/shared';
 import type { Hooks } from './initHooks';
+declare module '@rspack/core' {
+    interface Compiler {
+        __rsbuildTransformer?: Record<string, TransformHandler>;
+    }
+}
 export type { RsbuildPlugin, RsbuildPlugins, RsbuildPluginAPI };
 /** The inner context. */
 export type InternalContext = RsbuildContext & {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rsbuild/core",
-  "version": "0.5.5",
+  "version": "0.5.7",
   "description": "The Rspack-based build tool.",
   "homepage": "https://rsbuild.dev",
   "bugs": {
@@ -52,12 +52,12 @@
     "types.d.ts"
   ],
   "dependencies": {
-    "@rspack/core": "0.5.9-canary-8778e17-20240328104834",
+    "@rspack/core": "0.5.9-canary-8778e17-20240403045016",
     "@swc/helpers": "0.5.3",
     "core-js": "~3.36.0",
     "html-webpack-plugin": "npm:html-rspack-plugin@5.6.2",
     "postcss": "^8.4.38",
-    "@rsbuild/shared": "0.5.5"
+    "@rsbuild/shared": "0.5.7"
   },
   "devDependencies": {
     "@types/node": "16.x",