@modern-js/storybook-builder 2.40.0 → 2.42.0

package/dist/cjs/core.js

@@ -26,15 +26,19 @@ var import_core = require("@modern-js/core");
 var import_utils = require("./utils");
 var import_plugin_storybook = require("./plugin-storybook");
 async function getCompiler(cwd, builderOptions, options) {
-  const bundler = builderOptions.bundler || "webpack";
+  const { bundler } = builderOptions;
   const { presets } = options;
   const entries = await presets.apply("entries", []);
   const res = await (0, import_utils.runWithErrorMsg)(() => (0, import_core.loadConfig)(cwd, builderOptions.configPath || (0, import_utils.getConfigFileName)()), "Failed to load config");
   const loadedConfig = res ? res.config : {};
   const finalConfig = await presets.apply("modern", loadedConfig) || loadedConfig;
-  const provider = await (0, import_utils.getProvider)(bundler, finalConfig);
+  const provider = await (0, import_utils.getProvider)(bundler, (0, import_builder.mergeBuilderConfig)(finalConfig, builderOptions.builderConfig) || {});
   if (!provider) {
-    throw new Error(`@modern-js/builder-${bundler}-provider not found `);
+    if (bundler) {
+      throw new Error(`You choose to use ${bundler}, but @modern-js/builder-${bundler}-provider not found in your project, please install it`);
+    } else {
+      throw new Error(`Please install one provider first, try install @modern-js/builder-rspack-provider or @modern-js/builder-webpack-provider first`);
+    }
   }
   const builder = await (0, import_builder.createBuilder)(provider, {
     cwd,

package/dist/cjs/plugin-storybook.js

@@ -89,6 +89,7 @@ const pluginStorybook = (cwd, options) => {
         await applyCsfPlugin(config, options);
       };
       if ("modifyWebpackConfig" in api) {
+        addonAdapter(api, options);
         api.modifyWebpackConfig(modifyConfig);
         api.modifyWebpackChain(async (chain) => {
           await (0, import_docgen.applyDocgenWebpack)(chain, options);
@@ -223,6 +224,12 @@ async function applyMdxLoader(config, options) {
   var _rules;
   (_rules = (_config_module = config.module).rules) !== null && _rules !== void 0 ? _rules : _config_module.rules = [];
   config.module.rules.push({
+    resourceQuery: /raw/,
+    type: "asset/source"
+  }, {
+    test: /\.md$/,
+    type: "asset/source"
+  }, {
     test: /(stories|story)\.mdx$/,
     use: [
       {
@@ -253,7 +260,7 @@ function applyExternals(builderConfig) {
     }
   }, {
     output: {
-      externals: import_globals.globals
+      externals: import_globals.globalsNameReferenceMap
     }
   });
   builderConfig.output = config.output;
@@ -330,6 +337,57 @@ async function watchStories(patterns, cwd, writeModule) {
   ]);
   return watcher;
 }
+function addonAdapter(api, options) {
+  const { presets } = options;
+  api.modifyBuilderConfig(async (finalConfig) => {
+    var _finalConfig;
+    const babelOptions = await presets.apply("babel", {}, {
+      ...options
+    });
+    var _tools;
+    (_tools = (_finalConfig = finalConfig).tools) !== null && _tools !== void 0 ? _tools : _finalConfig.tools = {};
+    const userConfig = finalConfig.tools.babel;
+    finalConfig.tools.babel = (config, utils) => {
+      const getPluginName = (plugin) => Array.isArray(plugin) ? plugin[0] : plugin;
+      const getOptions = (plugin) => Array.isArray(plugin) ? plugin[1] : null;
+      const replaceOrInsert = (plugin, plugins) => {
+        const pluginName = getPluginName(plugin);
+        for (let i = 0; i < plugins.length; i++) {
+          if (getPluginName(plugins[i]) === pluginName) {
+            if (getOptions(plugin)) {
+              import_utils.logger.info(`Detected duplicated babel plugin or presets: ${pluginName}, overrides with the new one`);
+              plugins[i] = plugin;
+            }
+            return;
+          }
+        }
+        plugins.push(plugin);
+      };
+      const currentPlugins = config.plugins || [];
+      const currentPresets = config.presets || [];
+      for (const plugin of babelOptions.plugins || []) {
+        replaceOrInsert(plugin, currentPlugins);
+      }
+      for (const preset of babelOptions.presets || []) {
+        replaceOrInsert(preset, currentPresets);
+      }
+      const finalConfig2 = {
+        ...babelOptions,
+        plugins: currentPlugins,
+        presets: currentPresets
+      };
+      if (userConfig) {
+        return (0, import_utils.applyOptionsChain)(finalConfig2, userConfig, utils);
+      } else {
+        return finalConfig2;
+      }
+    };
+  });
+  api.modifyWebpackConfig(async (config) => {
+    const finalDefaultConfig = await presets.apply("webpackFinal", config, options);
+    return finalDefaultConfig;
+  });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   finalize,

package/dist/cjs/preset.js

@@ -48,7 +48,7 @@ const entries = async (_, options) => {
   if (options.configType === "DEVELOPMENT") {
     result.push(...[
       `${require.resolve("webpack-hot-middleware/client")}?reload=true&quiet=false&noInfo=${options.quiet}`,
-      bundler === "rspack" ? require.resolve("@rspack/dev-client/react-refresh-entry") : null
+      bundler === "rspack" ? require.resolve("@rspack/plugin-react-refresh/react-refresh-entry") : null
     ].filter(Boolean));
   }
   result.push(getStoriesConfigPath(process.cwd()));

package/dist/cjs/utils.js

@@ -59,14 +59,15 @@ async function getProvider(bundler, builderConfig) {
       return builderWebpackProvider({
         builderConfig
       });
-    } else {
+    } else if (bundler === "rspack") {
       const { builderRspackProvider } = await Promise.resolve().then(() => __toESM(require("@modern-js/builder-rspack-provider")));
       return builderRspackProvider({
         builderConfig
       });
+    } else {
+      return await getProvider("webpack", builderConfig) || await getProvider("rspack", builderConfig);
     }
   } catch (e) {
-    import_utils.logger.error(`Cannot find provider, you need to install @modern-js/builder-${bundler}-provider first`);
   }
 }
 async function virtualModule(tempDir, cwd, virtualModuleMap) {

package/dist/esm/core.js

@@ -1,9 +1,9 @@
-import { createBuilder } from "@modern-js/builder";
+import { createBuilder, mergeBuilderConfig } from "@modern-js/builder";
 import { loadConfig } from "@modern-js/core";
 import { getConfigFileName, getProvider, runWithErrorMsg } from "./utils";
 import { pluginStorybook } from "./plugin-storybook";
 async function getCompiler(cwd, builderOptions, options) {
-  const bundler = builderOptions.bundler || "webpack";
+  const { bundler } = builderOptions;
   const { presets } = options;
   const entries = await presets.apply("entries", []);
   const res = await runWithErrorMsg(
@@ -12,9 +12,20 @@ async function getCompiler(cwd, builderOptions, options) {
   );
   const loadedConfig = res ? res.config : {};
   const finalConfig = await presets.apply("modern", loadedConfig) || loadedConfig;
-  const provider = await getProvider(bundler, finalConfig);
+  const provider = await getProvider(
+    bundler,
+    mergeBuilderConfig(finalConfig, builderOptions.builderConfig) || {}
+  );
   if (!provider) {
-    throw new Error(`@modern-js/builder-${bundler}-provider not found `);
+    if (bundler) {
+      throw new Error(
+        `You choose to use ${bundler}, but @modern-js/builder-${bundler}-provider not found in your project, please install it`
+      );
+    } else {
+      throw new Error(
+        `Please install one provider first, try install @modern-js/builder-rspack-provider or @modern-js/builder-webpack-provider first`
+      );
+    }
   }
   const builder = await createBuilder(provider, {
     cwd,

package/dist/esm/plugin-storybook.js

@@ -1,5 +1,11 @@
 import { isAbsolute, join, resolve } from "path";
-import { slash, watch, globby, applyOptionsChain } from "@modern-js/utils";
+import {
+  slash,
+  watch,
+  globby,
+  applyOptionsChain,
+  logger
+} from "@modern-js/utils";
 import {
   mergeBuilderConfig
 } from "@modern-js/builder-shared";
@@ -10,7 +16,7 @@ import {
   readTemplate,
   loadPreviewOrConfigFile
 } from "@storybook/core-common";
-import { globals } from "@storybook/preview/globals";
+import { globalsNameReferenceMap } from "@storybook/preview/globals";
 import { unplugin as csfPlugin } from "@storybook/csf-plugin";
 import { minimatch } from "minimatch";
 import {
@@ -73,6 +79,7 @@ const pluginStorybook = (cwd, options) => {
         await applyCsfPlugin(config, options);
       };
       if ("modifyWebpackConfig" in api) {
+        addonAdapter(api, options);
         api.modifyWebpackConfig(modifyConfig);
         api.modifyWebpackChain(async (chain) => {
           await applyDocgenWebpack(chain, options);
@@ -218,6 +225,14 @@ async function applyMdxLoader(config, options) {
   (_d = config.module) != null ? _d : config.module = {};
   (_f = (_e = config.module).rules) != null ? _f : _e.rules = [];
   config.module.rules.push(
+    {
+      resourceQuery: /raw/,
+      type: "asset/source"
+    },
+    {
+      test: /\.md$/,
+      type: "asset/source"
+    },
     {
       test: /(stories|story)\.mdx$/,
       use: [
@@ -253,7 +268,7 @@ function applyExternals(builderConfig) {
     },
     {
       output: {
-        externals: globals
+        externals: globalsNameReferenceMap
       }
     }
   );
@@ -346,6 +361,60 @@ async function watchStories(patterns, cwd, writeModule) {
   );
   return watcher;
 }
+function addonAdapter(api, options) {
+  const { presets } = options;
+  api.modifyBuilderConfig(async (finalConfig) => {
+    var _a;
+    const babelOptions = await presets.apply("babel", {}, { ...options });
+    (_a = finalConfig.tools) != null ? _a : finalConfig.tools = {};
+    const userConfig = finalConfig.tools.babel;
+    finalConfig.tools.babel = (config, utils) => {
+      const getPluginName = (plugin) => Array.isArray(plugin) ? plugin[0] : plugin;
+      const getOptions = (plugin) => Array.isArray(plugin) ? plugin[1] : null;
+      const replaceOrInsert = (plugin, plugins) => {
+        const pluginName = getPluginName(plugin);
+        for (let i = 0; i < plugins.length; i++) {
+          if (getPluginName(plugins[i]) === pluginName) {
+            if (getOptions(plugin)) {
+              logger.info(
+                `Detected duplicated babel plugin or presets: ${pluginName}, overrides with the new one`
+              );
+              plugins[i] = plugin;
+            }
+            return;
+          }
+        }
+        plugins.push(plugin);
+      };
+      const currentPlugins = config.plugins || [];
+      const currentPresets = config.presets || [];
+      for (const plugin of babelOptions.plugins || []) {
+        replaceOrInsert(plugin, currentPlugins);
+      }
+      for (const preset of babelOptions.presets || []) {
+        replaceOrInsert(preset, currentPresets);
+      }
+      const finalConfig2 = {
+        ...babelOptions,
+        plugins: currentPlugins,
+        presets: currentPresets
+      };
+      if (userConfig) {
+        return applyOptionsChain(finalConfig2, userConfig, utils);
+      } else {
+        return finalConfig2;
+      }
+    };
+  });
+  api.modifyWebpackConfig(async (config) => {
+    const finalDefaultConfig = await presets.apply(
+      "webpackFinal",
+      config,
+      options
+    );
+    return finalDefaultConfig;
+  });
+}
 export {
   finalize,
   pluginStorybook

package/dist/esm/preset.js

@@ -14,7 +14,7 @@ const entries = async (_, options) => {
     result.push(
       ...[
         `${require.resolve("webpack-hot-middleware/client")}?reload=true&quiet=false&noInfo=${options.quiet}`,
-        bundler === "rspack" ? require.resolve("@rspack/dev-client/react-refresh-entry") : null
+        bundler === "rspack" ? require.resolve("@rspack/plugin-react-refresh/react-refresh-entry") : null
       ].filter(Boolean)
     );
   }

package/dist/esm/utils.js

@@ -15,16 +15,15 @@ async function getProvider(bundler, builderConfig) {
       return builderWebpackProvider({
         builderConfig
       });
-    } else {
+    } else if (bundler === "rspack") {
       const { builderRspackProvider } = await import("@modern-js/builder-rspack-provider");
       return builderRspackProvider({
         builderConfig
       });
+    } else {
+      return await getProvider("webpack", builderConfig) || await getProvider("rspack", builderConfig);
     }
   } catch (e) {
-    logger.error(
-      `Cannot find provider, you need to install @modern-js/builder-${bundler}-provider first`
-    );
   }
 }
 async function virtualModule(tempDir, cwd, virtualModuleMap) {

package/dist/types/addons/components/modern.d.ts

@@ -2,4 +2,4 @@
 import type { Plugin } from '@modern-js/runtime';
 import type { IConfig } from '../type';
 export declare const WrapProviders: (storyFn: any, config: IConfig) => JSX.Element;
-export declare const resolvePlugins: (runtime: IConfig['modernConfigRuntime']) => Plugin[];
+export declare const resolvePlugins: (runtime: IConfig['modernConfigRuntime']) => Plugin[];

package/dist/types/addons/constants.d.ts

@@ -1 +1 @@
-export declare const ADDON_ID = "storybook/modern-runtime";
+export declare const ADDON_ID = "storybook/modern-runtime";

package/dist/types/addons/index.d.ts

@@ -1,2 +1,2 @@
 declare const _default: {};
-export default _default;
+export default _default;

package/dist/types/addons/preset/preview.d.ts

@@ -1 +1 @@
-export declare const decorators: import("@storybook/types").DecoratorFunction[];
+export declare const decorators: import("@storybook/types").DecoratorFunction[];

package/dist/types/addons/type.d.ts

@@ -1,4 +1,4 @@
 export interface IConfig {
-  modernConfigRuntime: any;
-  modernConfigDesignToken: any;
-}
+    modernConfigRuntime: any;
+    modernConfigDesignToken: any;
+}

package/dist/types/addons/withPluginRuntime.d.ts

@@ -1,2 +1,2 @@
 import { DecoratorFunction } from '@storybook/types';
-export declare const withPluginRuntime: DecoratorFunction;
+export declare const withPluginRuntime: DecoratorFunction;

package/dist/types/build.d.ts

@@ -4,4 +4,4 @@ export type StorybookBuilder = RawStorybookBuilder<BuilderOptions, Stats>;
 export declare const getConfig: StorybookBuilder['getConfig'];
 export declare const build: StorybookBuilder['build'];
 export declare const start: StorybookBuilder['start'];
-export declare const bail: () => Promise<void>;
+export declare const bail: () => Promise<void>;

package/dist/types/core.d.ts

@@ -1,4 +1,4 @@
 import type { Options } from '@storybook/types';
 import type { Compiler } from '@modern-js/builder-shared/webpack-dev-middleware';
 import type { BuilderOptions } from './types';
-export declare function getCompiler(cwd: string, builderOptions: BuilderOptions, options: Options): Promise<Compiler>;
+export declare function getCompiler(cwd: string, builderOptions: BuilderOptions, options: Options): Promise<Compiler>;

package/dist/types/docgen/actualNameHandler.d.ts

@@ -11,4 +11,4 @@
 import type { NodePath } from 'ast-types/lib/node-path';
 import type { Importer } from 'react-docgen/dist/parse';
 import type Documentation from 'react-docgen/dist/Documentation';
-export default function actualNameHandler(documentation: Documentation, path: NodePath, importer: Importer): void;
+export default function actualNameHandler(documentation: Documentation, path: NodePath, importer: Importer): void;

package/dist/types/docgen/index.d.ts

@@ -2,8 +2,8 @@ import type { Options } from '@storybook/types';
 import { RspackConfig } from '@modern-js/builder-rspack-provider';
 import { WebpackChain } from '@modern-js/builder-webpack-provider';
 export type DocgenOptions = {
-  reactDocgen?: 'react-docgen' | 'react-docgen-typescript' | false;
-  reactDocgenTypescriptOptions?: any;
+    reactDocgen?: 'react-docgen' | 'react-docgen-typescript' | false;
+    reactDocgenTypescriptOptions?: any;
 };
 export declare function applyDocgenWebpack(chain: WebpackChain, options: Options): Promise<void>;
-export declare function applyDocgenRspack(config: RspackConfig, options: Options): Promise<void>;
+export declare function applyDocgenRspack(config: RspackConfig, options: Options): Promise<void>;

package/dist/types/docgen/loader.d.ts

@@ -1,2 +1,2 @@
 declare function docLoader(this: any, source: string, map: string, data: any): Promise<void>;
-export default docLoader;
+export default docLoader;

package/dist/types/docgen/process.d.ts

@@ -1,10 +1,6 @@
-declare const _default: ({
-  source,
-  map,
-  filename
-}: {
-  source: string;
-  map: string;
-  filename: string;
+declare const _default: ({ source, map, filename, }: {
+    source: string;
+    map: string;
+    filename: string;
 }) => string[] | null;
-export default _default;
+export default _default;

package/dist/types/index.d.ts

@@ -1,3 +1,3 @@
 export { start, build, bail, getConfig } from './build';
 export * from './types';
-export declare const corePresets: string[];
+export declare const corePresets: string[];

package/dist/types/plugin-storybook.d.ts

@@ -3,4 +3,4 @@ import type { Options } from '@storybook/types';
 import type { BuilderPluginAPI as WebpackAPI } from '@modern-js/builder-webpack-provider';
 import type { BuilderPluginAPI as RspackAPI } from '@modern-js/builder-rspack-provider';
 export declare function finalize(): Promise<void>;
-export declare const pluginStorybook: (cwd: string, options: Options) => BuilderPlugin<WebpackAPI | RspackAPI>;
+export declare const pluginStorybook: (cwd: string, options: Options) => BuilderPlugin<WebpackAPI | RspackAPI>;

package/dist/types/preset.d.ts

@@ -2,4 +2,4 @@ import type { Options } from '@storybook/types';
 import { BuilderConfig } from './types';
 export declare const previewMainTemplate: () => string;
 export declare const entries: (_: unknown, options: Options) => Promise<string[]>;
-export declare const modern: (builderConfig: BuilderConfig, options: Options) => BuilderConfig;
+export declare const modern: (builderConfig: BuilderConfig, options: Options) => BuilderConfig;

package/dist/types/types.d.ts

@@ -5,11 +5,11 @@ export type BundlerType = 'webpack' | 'rspack';
 export type { WebpackBuilderConfig, RspackBuilderConfig };
 export type AllBuilderConfig = WebpackBuilderConfig | RspackBuilderConfig;
 export type BuilderOptions = {
-  bundler?: BundlerType;
-  builderConfig?: AllBuilderConfig;
-  configPath?: string;
+    bundler?: BundlerType;
+    builderConfig?: AllBuilderConfig;
+    configPath?: string;
 };
 export type BuilderConfig = AllBuilderConfig & {
-  builderPlugins?: BuilderPlugin[];
+    builderPlugins?: BuilderPlugin[];
 };
-export { defineConfig } from '@modern-js/builder/cli';
+export { defineConfig } from '@modern-js/builder/cli';

package/dist/types/utils.d.ts

@@ -1,13 +1,15 @@
+import { BuilderWebpackProvider } from '@modern-js/builder-webpack-provider';
+import { BuilderRspackProvider } from '@modern-js/builder-rspack-provider';
 import { AllBuilderConfig } from './types';
 export declare const VIRTUAL_MODULE_BASE = ".MODERN_STORYBOOK";
 export declare const STORIES_FILENAME = "storybook-stories.js";
 export declare const STORYBOOK_CONFIG_ENTRY = "storybook-config-entry.js";
 export declare const requireResolve: (importer: string, path: string) => void;
-export declare function getProvider(bundler: 'webpack' | 'rspack', builderConfig: AllBuilderConfig): Promise<import("@modern-js/builder-webpack-provider").BuilderWebpackProvider | import("@modern-js/builder-rspack-provider").BuilderRspackProvider | undefined>;
+export declare function getProvider(bundler: 'webpack' | 'rspack' | undefined, builderConfig: AllBuilderConfig): Promise<BuilderWebpackProvider | BuilderRspackProvider | undefined>;
 export declare function virtualModule(tempDir: string, cwd: string, virtualModuleMap: Record<string, string>): Promise<[Record<string, string>, (p: string, content: string) => void]>;
 export declare function toImportFn(cwd: string, stories: string[]): Promise<string>;
 export declare function getAbsolutePath<I extends string>(input: I): I;
 export declare function maybeGetAbsolutePath<I extends string>(input: I): I | false;
 export declare function runWithErrorMsg<T>(op: () => Promise<T>, msg: string): Promise<T | undefined>;
 export declare function isDev(): boolean;
-export declare function getConfigFileName(): string;
+export declare function getConfigFileName(): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@modern-js/storybook-builder",
-  "version": "2.40.0",
+  "version": "2.42.0",
   "description": "modern.js support for storybook",
   "repository": {
     "type": "git",
@@ -17,19 +17,19 @@
   ],
   "exports": {
     ".": {
-      "jsnext:source": "./src/index.ts",
       "types": "./dist/types/index.d.ts",
+      "jsnext:source": "./src/index.ts",
       "default": "./dist/cjs/index.js"
     },
     "./preset": "./dist/esm/preset.js",
     "./addons": {
-      "jsnext:source": "./src/addons/preset/preview.ts",
       "types": "./dist/types/addons/preset/preview.d.ts",
+      "jsnext:source": "./src/addons/preset/preview.ts",
       "default": "./dist/esm/addons/preset/preview.js"
     },
     "./types": {
-      "jsnext:source": "./src/types.ts",
       "types": "./dist/types/types.d.ts",
+      "jsnext:source": "./src/types.ts",
       "default": "./dist/cjs/types.js"
     },
     "./templates/preview.ejs": "./templates/preview.ejs",
@@ -51,18 +51,18 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@rspack/dev-client": "0.3.2",
-    "@storybook/components": "^7.5.1",
-    "@storybook/core-common": "^7.5.1",
-    "@storybook/csf-plugin": "^7.5.1",
-    "@storybook/global": "^5.0.0",
-    "@storybook/mdx1-csf": "^1.0.0",
-    "@storybook/mdx2-csf": "^1.1.0",
-    "@storybook/preview": "^7.5.1",
-    "@storybook/preview-api": "^7.5.1",
+    "@rspack/plugin-react-refresh": "0.4.2",
+    "@storybook/components": "~7.6.1",
+    "@storybook/core-common": "~7.6.1",
+    "@storybook/csf-plugin": "~7.6.1",
+    "@storybook/global": "~5.0.0",
+    "@storybook/mdx1-csf": "~1.0.0",
+    "@storybook/mdx2-csf": "~1.1.0",
+    "@storybook/preview": "~7.6.1",
+    "@storybook/preview-api": "~7.6.1",
     "@storybook/react-docgen-typescript-plugin": "1.0.6--canary.9.0c3f3b7.0",
-    "@storybook/router": "^7.5.1",
-    "@storybook/theming": "^7.5.1",
+    "@storybook/router": "~7.6.1",
+    "@storybook/theming": "~7.6.1",
     "ast-types": "^0.14.2",
     "minimatch": "^9.0.3",
     "react-docgen": "6.0.0-alpha.3",
@@ -71,22 +71,34 @@
     "serve-static": "^1.14.1",
     "tinypool": "^0.8.0",
     "webpack-hot-middleware": "^2.25.4",
-    "@modern-js/builder": "2.40.0",
-    "@modern-js/builder-shared": "2.40.0",
-    "@modern-js/core": "2.40.0",
-    "@modern-js/runtime": "2.40.0",
-    "@modern-js/utils": "2.40.0"
+    "@modern-js/builder": "2.42.0",
+    "@modern-js/builder-shared": "2.42.0",
+    "@modern-js/utils": "2.42.0",
+    "@modern-js/runtime": "2.42.0",
+    "@modern-js/core": "2.42.0"
   },
   "devDependencies": {
-    "@storybook/types": "^7.5.1",
+    "@storybook/types": "~7.6.1",
     "@types/babel__core": "^7.20.1",
     "@types/serve-static": "^1.13.10",
     "@types/webpack-hot-middleware": "^2.25.6",
     "typescript": "^5.2.2",
-    "@modern-js/builder-rspack-provider": "2.40.0",
-    "@modern-js/builder-webpack-provider": "2.40.0",
-    "@modern-js/core": "2.40.0",
-    "@scripts/build": "2.40.0"
+    "@modern-js/builder-webpack-provider": "2.42.0",
+    "@modern-js/builder-rspack-provider": "2.42.0",
+    "@modern-js/core": "2.42.0",
+    "@scripts/build": "2.42.0"
+  },
+  "peerDependencies": {
+    "@modern-js/builder-webpack-provider": "^2.42.0",
+    "@modern-js/builder-rspack-provider": "^2.42.0"
+  },
+  "peerDependenciesMeta": {
+    "@modern-js/builder-webpack-provider": {
+      "optional": true
+    },
+    "@modern-js/builder-rspack-provider": {
+      "optional": true
+    }
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",

package/templates/virtualModuleModernEntry.js.handlebars

@@ -27,13 +27,13 @@ window.__STORYBOOK_CLIENT_API__ = new ClientApi({ storyStore: preview.storyStore
 
 preview.initialize({ importFn, getProjectAnnotations });
 
-if (import.meta.webpackHot) {
-  import.meta.webpackHot.accept('./{{storiesFilename}}', () => {
+if (module.hot) {
+  module.hot.accept('./{{storiesFilename}}', () => {
     // importFn has changed so we need to patch the new one in
     preview.onStoriesChanged({ importFn });
   });
 
-  import.meta.webpackHot.accept([
+  module.hot.accept([
     {{#each previewAnnotations}}'{{this}}',
     {{/each}}
   ], () => {