storybook-builder-rsbuild 0.0.6-beta.1 → 0.0.6-beta.3

package/dist/index.js

@@ -121,7 +121,7 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 var rsbuildReal = __toESM(require("@rsbuild/core"));
-var import_path4 = require("path");
+var import_path5 = require("path");
 var import_express = __toESM(require("express"));
 var import_fs_extra = __toESM(require("fs-extra"));
 var import_server_errors = require("storybook/internal/server-errors");
@@ -460,6 +460,10 @@ var iframe_rsbuild_config_default = async (options) => {
         config.optimization.runtimeChunk = true;
         config.optimization.usedExports = options.build?.test?.disableTreeShaking ? false : isProd;
         config.optimization.moduleIds = "named";
+        config.module ??= {};
+        config.module.parser ??= {};
+        config.module.parser.javascript ??= {};
+        config.module.parser.javascript.exportsPresence = false;
         appendPlugins(
           [
             new rspack.ProvidePlugin({
@@ -515,7 +519,47 @@ var iframe_rsbuild_config_default = async (options) => {
 
 // src/index.ts
 var import_core_path = require("storybook/core-path");
+
+// src/react-shims.ts
+var import_path4 = require("path");
+var import_promises = require("fs/promises");
+var getIsReactVersion18or19 = async (options) => {
+  const { legacyRootApi } = await options.presets.apply(
+    "frameworkOptions"
+  ) || {};
+  if (legacyRootApi) {
+    return false;
+  }
+  const resolvedReact = await options.presets.apply(
+    "resolvedReact",
+    {}
+  );
+  const reactDom = resolvedReact.reactDom || (0, import_path4.dirname)(require.resolve("react-dom/package.json"));
+  if (!(0, import_path4.isAbsolute)(reactDom)) {
+    return false;
+  }
+  const { version } = JSON.parse(
+    await (0, import_promises.readFile)((0, import_path4.join)(reactDom, "package.json"), "utf-8")
+  );
+  return version.startsWith("18") || version.startsWith("19") || version.startsWith("0.0.0");
+};
+var applyReactShims = async (config, options) => {
+  const isReactVersion18 = await getIsReactVersion18or19(options);
+  if (isReactVersion18) {
+    return config;
+  }
+  return {
+    source: {
+      alias: {
+        "@storybook/react-dom-shim": "@storybook/react-dom-shim/dist/react-16"
+      }
+    }
+  };
+};
+
+// src/index.ts
 var import_pretty_hrtime = __toESM(require_pretty_hrtime());
+var import_core2 = require("@rsbuild/core");
 var printDuration = (startTime) => (0, import_pretty_hrtime.default)(process.hrtime(startTime)).replace(" ms", " milliseconds").replace(" s", " seconds").replace(" m", " minutes");
 var executor = {
   get: async (options) => {
@@ -524,14 +568,16 @@ var executor = {
   }
 };
 var rsbuild = async (_, options) => {
-  const defaultConfig = await iframe_rsbuild_config_default(options);
   const { presets } = options;
+  let defaultConfig = await iframe_rsbuild_config_default(options);
+  const shimsConfig = await applyReactShims(defaultConfig, options);
+  defaultConfig = (0, import_core2.mergeRsbuildConfig)(defaultConfig, shimsConfig);
   const finalDefaultConfig = await presets.apply(
     "rsbuildFinal",
     defaultConfig,
     options
   );
-  return finalDefaultConfig;
+  return (0, import_core2.mergeRsbuildConfig)(finalDefaultConfig);
 };
 var getConfig = async (options) => {
   const { presets } = options;
@@ -589,7 +635,7 @@ var start = async ({
       error: new Error(`Missing Rsbuild build instance at runtime!`)
     });
   }
-  const previewResolvedDir = (0, import_path4.join)(import_core_path.corePath, "dist/preview");
+  const previewResolvedDir = (0, import_path5.join)(import_core_path.corePath, "dist/preview");
   const previewDirOrigin = previewResolvedDir;
   router.use(
     `/sb-preview`,
@@ -611,16 +657,16 @@ var build = async ({ options }) => {
     cwd: process.cwd(),
     rsbuildConfig: config
   });
-  const previewResolvedDir = (0, import_path4.join)(import_core_path.corePath, "dist/preview");
+  const previewResolvedDir = (0, import_path5.join)(import_core_path.corePath, "dist/preview");
   const previewDirOrigin = previewResolvedDir;
-  const previewDirTarget = (0, import_path4.join)(options.outputDir || "", `sb-preview`);
+  const previewDirTarget = (0, import_path5.join)(options.outputDir || "", `sb-preview`);
   let stats;
   rsbuildBuild.onAfterBuild((params) => {
     stats = params.stats;
   });
   const previewFiles = import_fs_extra.default.copy(previewDirOrigin, previewDirTarget, {
     filter: (src) => {
-      const { ext } = (0, import_path4.parse)(src);
+      const { ext } = (0, import_path5.parse)(src);
       if (ext) {
         return ext === ".js";
       }
@@ -633,7 +679,7 @@ var build = async ({ options }) => {
   await Promise.all([rsbuildBuild.build(), previewFiles]);
   return stats;
 };
-var corePresets = [(0, import_path4.join)(__dirname, "./preview-preset.js")];
+var corePresets = [(0, import_path5.join)(__dirname, "./preview-preset.js")];
 var previewMainTemplate = () => require.resolve("storybook-builder-rsbuild/templates/preview.ejs");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {

package/dist/index.mjs

@@ -1,7 +1,7 @@
 import { __commonJS, __toESM, __require } from './chunk-TTFRSOOU.mjs';
 import * as rsbuildReal from '@rsbuild/core';
-import { loadConfig, mergeRsbuildConfig } from '@rsbuild/core';
-import path, { join, resolve, parse, dirname } from 'path';
+import { mergeRsbuildConfig, loadConfig } from '@rsbuild/core';
+import path, { join, resolve, parse, dirname, isAbsolute } from 'path';
 import express from 'express';
 import fs2 from 'fs-extra';
 import { WebpackInvocationError } from 'storybook/internal/server-errors';
@@ -15,6 +15,7 @@ import { webpack } from '@storybook/addon-docs/dist/preset';
 import { pluginTypeCheck } from '@rsbuild/plugin-type-check';
 import { pluginHtmlMinifierTerser } from 'rsbuild-plugin-html-minifier-terser';
 import { corePath } from 'storybook/core-path';
+import { readFile } from 'fs/promises';
 
 // ../../node_modules/.pnpm/pretty-hrtime@1.0.3/node_modules/pretty-hrtime/index.js
 var require_pretty_hrtime = __commonJS({
@@ -402,6 +403,10 @@ var iframe_rsbuild_config_default = async (options) => {
         config.optimization.runtimeChunk = true;
         config.optimization.usedExports = options.build?.test?.disableTreeShaking ? false : isProd;
         config.optimization.moduleIds = "named";
+        config.module ??= {};
+        config.module.parser ??= {};
+        config.module.parser.javascript ??= {};
+        config.module.parser.javascript.exportsPresence = false;
         appendPlugins(
           [
             new rspack.ProvidePlugin({
@@ -454,6 +459,39 @@ var iframe_rsbuild_config_default = async (options) => {
   });
   return merged;
 };
+var getIsReactVersion18or19 = async (options) => {
+  const { legacyRootApi } = await options.presets.apply(
+    "frameworkOptions"
+  ) || {};
+  if (legacyRootApi) {
+    return false;
+  }
+  const resolvedReact = await options.presets.apply(
+    "resolvedReact",
+    {}
+  );
+  const reactDom = resolvedReact.reactDom || dirname(__require.resolve("react-dom/package.json"));
+  if (!isAbsolute(reactDom)) {
+    return false;
+  }
+  const { version } = JSON.parse(
+    await readFile(join(reactDom, "package.json"), "utf-8")
+  );
+  return version.startsWith("18") || version.startsWith("19") || version.startsWith("0.0.0");
+};
+var applyReactShims = async (config, options) => {
+  const isReactVersion18 = await getIsReactVersion18or19(options);
+  if (isReactVersion18) {
+    return config;
+  }
+  return {
+    source: {
+      alias: {
+        "@storybook/react-dom-shim": "@storybook/react-dom-shim/dist/react-16"
+      }
+    }
+  };
+};
 
 // src/index.ts
 var import_pretty_hrtime = __toESM(require_pretty_hrtime());
@@ -465,14 +503,16 @@ var executor = {
   }
 };
 var rsbuild = async (_, options) => {
-  const defaultConfig = await iframe_rsbuild_config_default(options);
   const { presets } = options;
+  let defaultConfig = await iframe_rsbuild_config_default(options);
+  const shimsConfig = await applyReactShims(defaultConfig, options);
+  defaultConfig = mergeRsbuildConfig(defaultConfig, shimsConfig);
   const finalDefaultConfig = await presets.apply(
     "rsbuildFinal",
     defaultConfig,
     options
   );
-  return finalDefaultConfig;
+  return mergeRsbuildConfig(finalDefaultConfig);
 };
 var getConfig = async (options) => {
   const { presets } = options;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "storybook-builder-rsbuild",
-  "version": "0.0.6-beta.1",
+  "version": "0.0.6-beta.3",
   "description": "Rsbuild builder for Storybook",
   "keywords": [
     "storybook",