@remotion/bundler 4.0.424 → 4.0.426

package/dist/bundle.d.ts

@@ -12,6 +12,7 @@ export type MandatoryLegacyBundleOptions = {
     onSymlinkDetected: (path: string) => void;
     keyboardShortcutsEnabled: boolean;
     askAIEnabled: boolean;
+    rspack: boolean;
 };
 export type LegacyBundleOptions = Partial<MandatoryLegacyBundleOptions>;
 export declare const getConfig: ({ entryPoint, outDir, resolvedRemotionRoot, onProgress, options, bufferStateDelayInMilliseconds, maxTimelineTracks, experimentalClientSideRenderingEnabled, }: {
@@ -21,9 +22,9 @@ export declare const getConfig: ({ entryPoint, outDir, resolvedRemotionRoot, onP
     bufferStateDelayInMilliseconds: number | null;
     experimentalClientSideRenderingEnabled: boolean;
     maxTimelineTracks: number | null;
-    onProgress?: ((progress: number) => void) | undefined;
-    options?: Partial<MandatoryLegacyBundleOptions> | undefined;
-}) => Promise<[string, webpack.Configuration]>;
+    onProgress: (progress: number) => void;
+    options: MandatoryLegacyBundleOptions;
+}) => Promise<[string, webpack.Configuration]> | Promise<[string, import("@rspack/core").RspackOptions]>;
 type NewBundleOptions = {
     entryPoint: string;
     onProgress: (progress: number) => void;

package/dist/bundle.js

@@ -48,6 +48,7 @@ const webpack_1 = __importDefault(require("webpack"));
 const copy_dir_1 = require("./copy-dir");
 const index_html_1 = require("./index-html");
 const read_recursively_1 = require("./read-recursively");
+const rspack_config_1 = require("./rspack-config");
 const webpack_config_1 = require("./webpack-config");
 const promisified = (0, node_util_1.promisify)(webpack_1.default);
 const prepareOutDir = async (specified) => {
@@ -71,7 +72,7 @@ const trimTrailingSlash = (p) => {
 };
 const getConfig = ({ entryPoint, outDir, resolvedRemotionRoot, onProgress, options, bufferStateDelayInMilliseconds, maxTimelineTracks, experimentalClientSideRenderingEnabled, }) => {
     var _a, _b, _c, _d;
-    return (0, webpack_config_1.webpackConfig)({
+    const configArgs = {
         entry: node_path_1.default.join(require.resolve('@remotion/studio/renderEntry'), '..', 'esm', 'renderEntry.mjs'),
         userDefinedComponent: entryPoint,
         outDir,
@@ -88,7 +89,11 @@ const getConfig = ({ entryPoint, outDir, resolvedRemotionRoot, onProgress, optio
         poll: null,
         experimentalClientSideRenderingEnabled,
         askAIEnabled: (_d = options === null || options === void 0 ? void 0 : options.askAIEnabled) !== null && _d !== void 0 ? _d : true,
-    });
+    };
+    if (options.rspack) {
+        return (0, rspack_config_1.rspackConfig)(configArgs);
+    }
+    return (0, webpack_config_1.webpackConfig)(configArgs);
 };
 exports.getConfig = getConfig;
 const convertArgumentsIntoOptions = (args) => {
@@ -166,16 +171,40 @@ const internalBundle = async (actualArgs) => {
         maxTimelineTracks: actualArgs.maxTimelineTracks,
         experimentalClientSideRenderingEnabled: actualArgs.experimentalClientSideRenderingEnabled,
     });
-    const output = (await promisified([config]));
-    if (node_worker_threads_1.isMainThread) {
-        process.chdir(currentCwd);
-    }
-    if (!output) {
-        throw new Error('Expected webpack output');
+    if (actualArgs.rspack) {
+        const { rspack: rspackFn } = require('@rspack/core');
+        const rspackCompiler = rspackFn(config);
+        const rspackOutput = await new Promise((resolve, reject) => {
+            rspackCompiler.run((err, stats) => {
+                if (err) {
+                    reject(err);
+                    return;
+                }
+                rspackCompiler.close(() => {
+                    resolve(stats);
+                });
+            });
+        });
+        if (node_worker_threads_1.isMainThread) {
+            process.chdir(currentCwd);
+        }
+        const { errors } = rspackOutput.toJson({});
+        if (errors !== undefined && errors.length > 0) {
+            throw new Error(errors[0].message + '\n' + errors[0].details);
+        }
     }
-    const { errors } = output.toJson();
-    if (errors !== undefined && errors.length > 0) {
-        throw new Error(errors[0].message + '\n' + errors[0].details);
+    else {
+        const output = (await promisified([config]));
+        if (node_worker_threads_1.isMainThread) {
+            process.chdir(currentCwd);
+        }
+        if (!output) {
+            throw new Error('Expected webpack output');
+        }
+        const { errors } = output.toJson();
+        if (errors !== undefined && errors.length > 0) {
+            throw new Error(errors[0].message + '\n' + errors[0].details);
+        }
     }
     const publicPath = (_f = actualArgs === null || actualArgs === void 0 ? void 0 : actualArgs.publicPath) !== null && _f !== void 0 ? _f : '/';
     const staticHash = '/' +
@@ -261,7 +290,7 @@ exports.internalBundle = internalBundle;
  * @see [Documentation](https://remotion.dev/docs/bundle)
  */
 async function bundle(...args) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v;
     const actualArgs = convertArgumentsIntoOptions(args);
     const result = await (0, exports.internalBundle)({
         bufferStateDelayInMilliseconds: (_a = actualArgs.bufferStateDelayInMilliseconds) !== null && _a !== void 0 ? _a : null,
@@ -284,6 +313,7 @@ async function bundle(...args) {
         renderDefaults: (_s = actualArgs.renderDefaults) !== null && _s !== void 0 ? _s : null,
         askAIEnabled: (_t = actualArgs.askAIEnabled) !== null && _t !== void 0 ? _t : true,
         keyboardShortcutsEnabled: (_u = actualArgs.keyboardShortcutsEnabled) !== null && _u !== void 0 ? _u : true,
+        rspack: (_v = actualArgs.rspack) !== null && _v !== void 0 ? _v : false,
     });
     return result;
 }

package/dist/define-plugin-definitions.d.ts

@@ -0,0 +1,13 @@
+export declare const getDefinePluginDefinitions: ({ maxTimelineTracks, askAIEnabled, keyboardShortcutsEnabled, bufferStateDelayInMilliseconds, experimentalClientSideRenderingEnabled, }: {
+    maxTimelineTracks: number | null;
+    askAIEnabled: boolean;
+    keyboardShortcutsEnabled: boolean;
+    bufferStateDelayInMilliseconds: number | null;
+    experimentalClientSideRenderingEnabled: boolean;
+}) => {
+    'process.env.MAX_TIMELINE_TRACKS': number | null;
+    'process.env.ASK_AI_ENABLED': boolean;
+    'process.env.KEYBOARD_SHORTCUTS_ENABLED': boolean;
+    'process.env.BUFFER_STATE_DELAY_IN_MILLISECONDS': number | null;
+    'process.env.EXPERIMENTAL_CLIENT_SIDE_RENDERING_ENABLED': boolean;
+};

package/dist/define-plugin-definitions.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getDefinePluginDefinitions = void 0;
+const getDefinePluginDefinitions = ({ maxTimelineTracks, askAIEnabled, keyboardShortcutsEnabled, bufferStateDelayInMilliseconds, experimentalClientSideRenderingEnabled, }) => ({
+    'process.env.MAX_TIMELINE_TRACKS': maxTimelineTracks,
+    'process.env.ASK_AI_ENABLED': askAIEnabled,
+    'process.env.KEYBOARD_SHORTCUTS_ENABLED': keyboardShortcutsEnabled,
+    'process.env.BUFFER_STATE_DELAY_IN_MILLISECONDS': bufferStateDelayInMilliseconds,
+    'process.env.EXPERIMENTAL_CLIENT_SIDE_RENDERING_ENABLED': experimentalClientSideRenderingEnabled,
+});
+exports.getDefinePluginDefinitions = getDefinePluginDefinitions;

package/dist/index.d.ts

@@ -18,6 +18,23 @@ export declare const BundlerInternals: {
         askAIEnabled: boolean;
         experimentalClientSideRenderingEnabled: boolean;
     }) => Promise<[string, webpack.Configuration]>;
+    rspackConfig: ({ entry, userDefinedComponent, outDir, environment, webpackOverride, onProgress, enableCaching, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, bufferStateDelayInMilliseconds, poll, experimentalClientSideRenderingEnabled, askAIEnabled, }: {
+        entry: string;
+        userDefinedComponent: string;
+        outDir: string | null;
+        environment: "development" | "production";
+        webpackOverride: import("./webpack-config").WebpackOverrideFn;
+        onProgress?: ((f: number) => void) | undefined;
+        enableCaching?: boolean | undefined;
+        maxTimelineTracks: number | null;
+        keyboardShortcutsEnabled: boolean;
+        bufferStateDelayInMilliseconds: number | null;
+        remotionRoot: string;
+        poll: number | null;
+        askAIEnabled: boolean;
+        experimentalClientSideRenderingEnabled: boolean;
+    }) => Promise<[string, import("@rspack/core").RspackOptions]>;
+    createRspackCompiler: (config: import("@rspack/core").RspackOptions) => import("@rspack/core").Compiler;
     indexHtml: ({ publicPath, editorName, inputProps, envVariables, staticHash, remotionRoot, studioServerCommand, renderQueue, completedClientRenders, numberOfAudioTags, publicFiles, includeFavicon, title, renderDefaults, publicFolderExists, gitSource, projectName, installedDependencies, packageManager, audioLatencyHint, logLevel, mode, }: {
         staticHash: string;
         publicPath: string;
@@ -51,9 +68,9 @@ export declare const BundlerInternals: {
         bufferStateDelayInMilliseconds: number | null;
         experimentalClientSideRenderingEnabled: boolean;
         maxTimelineTracks: number | null;
-        onProgress?: ((progress: number) => void) | undefined;
-        options?: Partial<import("./bundle").MandatoryLegacyBundleOptions> | undefined;
-    }) => Promise<[string, webpack.Configuration]>;
+        onProgress: (progress: number) => void;
+        options: import("./bundle").MandatoryLegacyBundleOptions;
+    }) => Promise<[string, webpack.Configuration]> | Promise<[string, import("@rspack/core").RspackOptions]>;
     readRecursively: ({ folder, output, startPath, staticHash, limit, }: {
         folder: string;
         startPath: string;

package/dist/index.js

@@ -4,6 +4,7 @@ exports.webpack = exports.bundle = exports.BundlerInternals = void 0;
 const bundle_1 = require("./bundle");
 const index_html_1 = require("./index-html");
 const read_recursively_1 = require("./read-recursively");
+const rspack_config_1 = require("./rspack-config");
 const webpack_cache_1 = require("./webpack-cache");
 const webpack_config_1 = require("./webpack-config");
 const esbuild = require("esbuild");
@@ -12,6 +13,8 @@ exports.webpack = webpack;
 exports.BundlerInternals = {
     esbuild,
     webpackConfig: webpack_config_1.webpackConfig,
+    rspackConfig: rspack_config_1.rspackConfig,
+    createRspackCompiler: rspack_config_1.createRspackCompiler,
     indexHtml: index_html_1.indexHtml,
     cacheExists: webpack_cache_1.cacheExists,
     clearCache: webpack_cache_1.clearCache,

package/dist/rspack-config.d.ts

@@ -0,0 +1,20 @@
+import type { Configuration } from '@rspack/core';
+import type { WebpackOverrideFn } from './webpack-config';
+export type RspackConfiguration = Configuration;
+export declare const rspackConfig: ({ entry, userDefinedComponent, outDir, environment, webpackOverride, onProgress, enableCaching, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, bufferStateDelayInMilliseconds, poll, experimentalClientSideRenderingEnabled, askAIEnabled, }: {
+    entry: string;
+    userDefinedComponent: string;
+    outDir: string | null;
+    environment: "development" | "production";
+    webpackOverride: WebpackOverrideFn;
+    onProgress?: ((f: number) => void) | undefined;
+    enableCaching?: boolean | undefined;
+    maxTimelineTracks: number | null;
+    keyboardShortcutsEnabled: boolean;
+    bufferStateDelayInMilliseconds: number | null;
+    remotionRoot: string;
+    poll: number | null;
+    askAIEnabled: boolean;
+    experimentalClientSideRenderingEnabled: boolean;
+}) => Promise<[string, import("@rspack/core").RspackOptions]>;
+export declare const createRspackCompiler: (config: import("@rspack/core").RspackOptions) => import("@rspack/core").Compiler;

package/dist/rspack-config.js

@@ -0,0 +1,115 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRspackCompiler = exports.rspackConfig = void 0;
+const core_1 = require("@rspack/core");
+const plugin_react_refresh_1 = __importDefault(require("@rspack/plugin-react-refresh"));
+const define_plugin_definitions_1 = require("./define-plugin-definitions");
+const shared_bundler_config_1 = require("./shared-bundler-config");
+const rspackConfig = async ({ entry, userDefinedComponent, outDir, environment, webpackOverride = (f) => f, onProgress, enableCaching = true, maxTimelineTracks, remotionRoot, keyboardShortcutsEnabled, bufferStateDelayInMilliseconds, poll, experimentalClientSideRenderingEnabled, askAIEnabled, }) => {
+    let lastProgress = 0;
+    const define = new core_1.DefinePlugin((0, define_plugin_definitions_1.getDefinePluginDefinitions)({
+        maxTimelineTracks,
+        askAIEnabled,
+        keyboardShortcutsEnabled,
+        bufferStateDelayInMilliseconds,
+        experimentalClientSideRenderingEnabled,
+    }));
+    const swcLoaderRule = {
+        loader: 'builtin:swc-loader',
+        options: {
+            jsc: {
+                parser: { syntax: 'typescript', tsx: true },
+                transform: {
+                    react: {
+                        runtime: 'automatic',
+                        development: environment === 'development',
+                        refresh: environment === 'development',
+                    },
+                },
+            },
+            env: { targets: 'Chrome >= 85' },
+        },
+    };
+    const swcLoaderRuleJsx = {
+        loader: 'builtin:swc-loader',
+        options: {
+            jsc: {
+                parser: { syntax: 'ecmascript', jsx: true },
+                transform: {
+                    react: {
+                        runtime: 'automatic',
+                        development: environment === 'development',
+                        refresh: environment === 'development',
+                    },
+                },
+            },
+            env: { targets: 'Chrome >= 85' },
+        },
+    };
+    // Rspack config is structurally compatible with webpack config at runtime,
+    // but the TypeScript types differ. Cast through `any` for the override.
+    const conf = (await webpackOverride({
+        ...(0, shared_bundler_config_1.getBaseConfig)(environment, poll),
+        ignoreWarnings: [
+            /Circular dependency between chunks with runtime/,
+            /Critical dependency: the request of a dependency is an expression/,
+            /"__dirname" is used and has been mocked/,
+        ],
+        entry: [
+            require.resolve('./setup-environment'),
+            userDefinedComponent,
+            require.resolve('../react-shim.js'),
+            entry,
+        ].filter(Boolean),
+        mode: environment,
+        plugins: environment === 'development'
+            ? [
+                new plugin_react_refresh_1.default({ overlay: false }),
+                new core_1.rspack.HotModuleReplacementPlugin(),
+                define,
+            ]
+            : [
+                new core_1.ProgressPlugin((p) => {
+                    if (onProgress) {
+                        if ((p === 1 && p > lastProgress) || p - lastProgress > 0.05) {
+                            lastProgress = p;
+                            onProgress(Number((p * 100).toFixed(2)));
+                        }
+                    }
+                }),
+                define,
+            ],
+        output: (0, shared_bundler_config_1.getOutputConfig)(environment),
+        resolve: (0, shared_bundler_config_1.getResolveConfig)(),
+        module: {
+            rules: [
+                ...(0, shared_bundler_config_1.getSharedModuleRules)(),
+                {
+                    test: /\.tsx?$/,
+                    use: [swcLoaderRule],
+                },
+                {
+                    test: /\.jsx?$/,
+                    exclude: /node_modules/,
+                    use: [swcLoaderRuleJsx],
+                },
+            ],
+        },
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    }));
+    const [hash, finalConf] = (0, shared_bundler_config_1.computeHashAndFinalConfig)(conf, {
+        enableCaching,
+        environment,
+        outDir,
+        remotionRoot,
+    });
+    return [hash, finalConf];
+};
+exports.rspackConfig = rspackConfig;
+const createRspackCompiler = (config) => {
+    return (0, core_1.rspack)(config);
+};
+exports.createRspackCompiler = createRspackCompiler;

package/dist/shared-bundler-config.d.ts

@@ -0,0 +1,54 @@
+export declare const shouldUseReactDomClient: boolean;
+export declare const getResolveConfig: () => {
+    extensions: string[];
+    alias: {
+        'react/jsx-runtime': string;
+        'react/jsx-dev-runtime': string;
+        react: string;
+        'remotion/no-react': string;
+        'remotion/version': string;
+        remotion: string;
+        '@remotion/media-parser/worker': string;
+        '@remotion/studio': string;
+        'react-dom/client': string;
+    };
+};
+export declare const getOutputConfig: (environment: "development" | "production") => {
+    hashFunction: "xxhash64";
+    filename: string;
+    devtoolModuleFilenameTemplate: string;
+    assetModuleFilename: string;
+};
+export declare const getBaseConfig: (environment: "development" | "production", poll: number | null) => {
+    optimization: {
+        minimize: boolean;
+    };
+    experiments: {
+        lazyCompilation: boolean | {
+            entries: boolean;
+        };
+    };
+    watchOptions: {
+        poll: number | undefined;
+        aggregateTimeout: number;
+        ignored: string[];
+    };
+    devtool: "cheap-module-source-map" | "source-map";
+};
+export declare const getSharedModuleRules: () => ({
+    test: RegExp;
+    use: string[];
+    type: "javascript/auto";
+} | {
+    use?: undefined;
+    test: RegExp;
+    type: "asset/resource";
+})[];
+export declare const computeHashAndFinalConfig: <T extends {
+    output?: any;
+}>(conf: T, options: {
+    enableCaching: boolean;
+    environment: "development" | "production";
+    outDir: string | null;
+    remotionRoot: string;
+}) => [string, T];

package/dist/shared-bundler-config.js

@@ -0,0 +1,117 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.computeHashAndFinalConfig = exports.getSharedModuleRules = exports.getBaseConfig = exports.getOutputConfig = exports.getResolveConfig = exports.shouldUseReactDomClient = void 0;
+const node_crypto_1 = require("node:crypto");
+const node_path_1 = __importDefault(require("node:path"));
+const react_dom_1 = __importDefault(require("react-dom"));
+const no_react_1 = require("remotion/no-react");
+const stringify_with_circular_references_1 = require("./stringify-with-circular-references");
+const webpack_cache_1 = require("./webpack-cache");
+if (!(react_dom_1.default === null || react_dom_1.default === void 0 ? void 0 : react_dom_1.default.version)) {
+    throw new Error('Could not find "react-dom" package. Did you install it?');
+}
+const reactDomVersion = react_dom_1.default.version.split('.')[0];
+if (reactDomVersion === '0') {
+    throw new Error(`Version ${reactDomVersion} of "react-dom" is not supported by Remotion`);
+}
+exports.shouldUseReactDomClient = no_react_1.NoReactInternals.ENABLE_V5_BREAKING_CHANGES
+    ? true
+    : parseInt(reactDomVersion, 10) >= 18;
+const getResolveConfig = () => ({
+    extensions: ['.ts', '.tsx', '.web.js', '.js', '.jsx', '.mjs', '.cjs'],
+    alias: {
+        // Only one version of react
+        'react/jsx-runtime': require.resolve('react/jsx-runtime'),
+        'react/jsx-dev-runtime': require.resolve('react/jsx-dev-runtime'),
+        react: require.resolve('react'),
+        // Needed to not fail on this: https://github.com/remotion-dev/remotion/issues/5045
+        'remotion/no-react': node_path_1.default.resolve(require.resolve('remotion'), '..', '..', 'esm', 'no-react.mjs'),
+        'remotion/version': node_path_1.default.resolve(require.resolve('remotion'), '..', '..', 'esm', 'version.mjs'),
+        remotion: node_path_1.default.resolve(require.resolve('remotion'), '..', '..', 'esm', 'index.mjs'),
+        '@remotion/media-parser/worker': node_path_1.default.resolve(require.resolve('@remotion/media-parser'), '..', 'esm', 'worker.mjs'),
+        // test visual controls before removing this
+        '@remotion/studio': require.resolve('@remotion/studio'),
+        'react-dom/client': exports.shouldUseReactDomClient
+            ? require.resolve('react-dom/client')
+            : require.resolve('react-dom'),
+    },
+});
+exports.getResolveConfig = getResolveConfig;
+const getOutputConfig = (environment) => ({
+    hashFunction: 'xxhash64',
+    filename: no_react_1.NoReactInternals.bundleName,
+    devtoolModuleFilenameTemplate: '[resource-path]',
+    assetModuleFilename: environment === 'development' ? '[path][name][ext]' : '[hash][ext]',
+});
+exports.getOutputConfig = getOutputConfig;
+const getBaseConfig = (environment, poll) => {
+    const isBun = typeof Bun !== 'undefined';
+    return {
+        optimization: {
+            minimize: false,
+        },
+        experiments: {
+            lazyCompilation: isBun
+                ? false
+                : environment === 'production'
+                    ? false
+                    : {
+                        entries: false,
+                    },
+        },
+        watchOptions: {
+            poll: poll !== null && poll !== void 0 ? poll : undefined,
+            aggregateTimeout: 0,
+            ignored: ['**/.git/**', '**/.turbo/**', '**/node_modules/**'],
+        },
+        // Higher source map quality in development to power line numbers for stack traces
+        devtool: environment === 'development'
+            ? 'source-map'
+            : 'cheap-module-source-map',
+    };
+};
+exports.getBaseConfig = getBaseConfig;
+const getSharedModuleRules = () => [
+    {
+        test: /\.css$/i,
+        use: [require.resolve('style-loader'), require.resolve('css-loader')],
+        type: 'javascript/auto',
+    },
+    {
+        test: /\.(png|svg|jpg|jpeg|webp|gif|bmp|webm|mp4|mov|mp3|m4a|wav|aac)$/,
+        type: 'asset/resource',
+    },
+    {
+        test: /\.(woff(2)?|otf|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
+        type: 'asset/resource',
+    },
+];
+exports.getSharedModuleRules = getSharedModuleRules;
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const computeHashAndFinalConfig = (conf, options) => {
+    const hash = (0, node_crypto_1.createHash)('md5')
+        .update((0, stringify_with_circular_references_1.jsonStringifyWithCircularReferences)(conf))
+        .digest('hex');
+    return [
+        hash,
+        {
+            ...conf,
+            cache: options.enableCaching
+                ? {
+                    type: 'filesystem',
+                    name: (0, webpack_cache_1.getWebpackCacheName)(options.environment, hash),
+                    version: hash,
+                }
+                : false,
+            output: {
+                ...conf.output,
+                ...(options.outDir ? { path: options.outDir } : {}),
+            },
+            context: options.remotionRoot,
+        },
+    ];
+};
+exports.computeHashAndFinalConfig = computeHashAndFinalConfig;

package/dist/webpack-config.js

@@ -32,34 +32,17 @@ var __importStar = (this && this.__importStar) || (function () {
         return result;
     };
 })();
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.webpackConfig = void 0;
-const node_crypto_1 = require("node:crypto");
-const node_path_1 = __importDefault(require("node:path"));
-const react_dom_1 = __importDefault(require("react-dom"));
-const no_react_1 = require("remotion/no-react");
 const webpack_1 = __importStar(require("webpack"));
 const case_sensitive_paths_1 = require("./case-sensitive-paths");
+const define_plugin_definitions_1 = require("./define-plugin-definitions");
 const fast_refresh_1 = require("./fast-refresh");
 const hide_expression_dependency_1 = require("./hide-expression-dependency");
 const ignore_packfilecache_warnings_1 = require("./ignore-packfilecache-warnings");
 const optional_dependencies_1 = require("./optional-dependencies");
-const stringify_with_circular_references_1 = require("./stringify-with-circular-references");
-const webpack_cache_1 = require("./webpack-cache");
+const shared_bundler_config_1 = require("./shared-bundler-config");
 const esbuild = require("esbuild");
-if (!(react_dom_1.default === null || react_dom_1.default === void 0 ? void 0 : react_dom_1.default.version)) {
-    throw new Error('Could not find "react-dom" package. Did you install it?');
-}
-const reactDomVersion = react_dom_1.default.version.split('.')[0];
-if (reactDomVersion === '0') {
-    throw new Error(`Version ${reactDomVersion} of "react-dom" is not supported by Remotion`);
-}
-const shouldUseReactDomClient = no_react_1.NoReactInternals.ENABLE_V5_BREAKING_CHANGES
-    ? true
-    : parseInt(reactDomVersion, 10) >= 18;
 function truthy(value) {
     return Boolean(value);
 }
@@ -71,34 +54,15 @@ const webpackConfig = async ({ entry, userDefinedComponent, outDir, environment,
         remotionRoot,
     };
     let lastProgress = 0;
-    const isBun = typeof Bun !== 'undefined';
-    const define = new webpack_1.default.DefinePlugin({
-        'process.env.MAX_TIMELINE_TRACKS': maxTimelineTracks,
-        'process.env.ASK_AI_ENABLED': askAIEnabled,
-        'process.env.KEYBOARD_SHORTCUTS_ENABLED': keyboardShortcutsEnabled,
-        'process.env.BUFFER_STATE_DELAY_IN_MILLISECONDS': bufferStateDelayInMilliseconds,
-        'process.env.EXPERIMENTAL_CLIENT_SIDE_RENDERING_ENABLED': experimentalClientSideRenderingEnabled,
-    });
+    const define = new webpack_1.default.DefinePlugin((0, define_plugin_definitions_1.getDefinePluginDefinitions)({
+        maxTimelineTracks,
+        askAIEnabled,
+        keyboardShortcutsEnabled,
+        bufferStateDelayInMilliseconds,
+        experimentalClientSideRenderingEnabled,
+    }));
     const conf = await webpackOverride({
-        optimization: {
-            minimize: false,
-        },
-        experiments: {
-            lazyCompilation: isBun
-                ? false
-                : environment === 'production'
-                    ? false
-                    : {
-                        entries: false,
-                    },
-        },
-        watchOptions: {
-            poll: poll !== null && poll !== void 0 ? poll : undefined,
-            aggregateTimeout: 0,
-            ignored: ['**/.git/**', '**/.turbo/**', '**/node_modules/**'],
-        },
-        // Higher source map quality in development to power line numbers for stack traces
-        devtool: environment === 'development' ? 'source-map' : 'cheap-module-source-map',
+        ...(0, shared_bundler_config_1.getBaseConfig)(environment, poll),
         entry: [
             // Fast Refresh must come first,
             // because setup-environment imports ReactDOM.
@@ -136,42 +100,11 @@ const webpackConfig = async ({ entry, userDefinedComponent, outDir, environment,
                 new hide_expression_dependency_1.AllowDependencyExpressionPlugin(),
                 new ignore_packfilecache_warnings_1.IgnorePackFileCacheWarningsPlugin(),
             ],
-        output: {
-            hashFunction: 'xxhash64',
-            filename: no_react_1.NoReactInternals.bundleName,
-            devtoolModuleFilenameTemplate: '[resource-path]',
-            assetModuleFilename: environment === 'development' ? '[path][name][ext]' : '[hash][ext]',
-        },
-        resolve: {
-            extensions: ['.ts', '.tsx', '.web.js', '.js', '.jsx', '.mjs', '.cjs'],
-            alias: {
-                // Only one version of react
-                'react/jsx-runtime': require.resolve('react/jsx-runtime'),
-                'react/jsx-dev-runtime': require.resolve('react/jsx-dev-runtime'),
-                react: require.resolve('react'),
-                // Needed to not fail on this: https://github.com/remotion-dev/remotion/issues/5045
-                'remotion/no-react': node_path_1.default.resolve(require.resolve('remotion'), '..', '..', 'esm', 'no-react.mjs'),
-                'remotion/version': node_path_1.default.resolve(require.resolve('remotion'), '..', '..', 'esm', 'version.mjs'),
-                remotion: node_path_1.default.resolve(require.resolve('remotion'), '..', '..', 'esm', 'index.mjs'),
-                '@remotion/media-parser/worker': node_path_1.default.resolve(require.resolve('@remotion/media-parser'), '..', 'esm', 'worker.mjs'),
-                // test visual controls before removing this
-                '@remotion/studio': require.resolve('@remotion/studio'),
-                'react-dom/client': shouldUseReactDomClient
-                    ? require.resolve('react-dom/client')
-                    : require.resolve('react-dom'),
-            },
-        },
+        output: (0, shared_bundler_config_1.getOutputConfig)(environment),
+        resolve: (0, shared_bundler_config_1.getResolveConfig)(),
         module: {
             rules: [
-                {
-                    test: /\.css$/i,
-                    use: [require.resolve('style-loader'), require.resolve('css-loader')],
-                    type: 'javascript/auto',
-                },
-                {
-                    test: /\.(png|svg|jpg|jpeg|webp|gif|bmp|webm|mp4|mov|mp3|m4a|wav|aac)$/,
-                    type: 'asset/resource',
-                },
+                ...(0, shared_bundler_config_1.getSharedModuleRules)(),
                 {
                     test: /\.tsx?$/,
                     use: [
@@ -187,10 +120,6 @@ const webpackConfig = async ({ entry, userDefinedComponent, outDir, environment,
                             : null,
                     ].filter(truthy),
                 },
-                {
-                    test: /\.(woff(2)?|otf|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
-                    type: 'asset/resource',
-                },
                 {
                     test: /\.jsx?$/,
                     exclude: /node_modules/,
@@ -209,26 +138,11 @@ const webpackConfig = async ({ entry, userDefinedComponent, outDir, environment,
             ],
         },
     });
-    const hash = (0, node_crypto_1.createHash)('md5')
-        .update((0, stringify_with_circular_references_1.jsonStringifyWithCircularReferences)(conf))
-        .digest('hex');
-    return [
-        hash,
-        {
-            ...conf,
-            cache: enableCaching
-                ? {
-                    type: 'filesystem',
-                    name: (0, webpack_cache_1.getWebpackCacheName)(environment, hash),
-                    version: hash,
-                }
-                : false,
-            output: {
-                ...conf.output,
-                ...(outDir ? { path: outDir } : {}),
-            },
-            context: remotionRoot,
-        },
-    ];
+    return (0, shared_bundler_config_1.computeHashAndFinalConfig)(conf, {
+        enableCaching,
+        environment,
+        outDir,
+        remotionRoot,
+    });
 };
 exports.webpackConfig = webpackConfig;

package/package.json

@@ -3,7 +3,7 @@
 		"url": "https://github.com/remotion-dev/remotion/tree/main/packages/bundler"
 	},
 	"name": "@remotion/bundler",
-	"version": "4.0.424",
+	"version": "4.0.426",
 	"description": "Bundle Remotion compositions using Webpack",
 	"main": "dist/index.js",
 	"sideEffects": false,
@@ -11,7 +11,7 @@
 		"url": "https://github.com/remotion-dev/remotion/issues"
 	},
 	"scripts": {
-		"formatting": "prettier --experimental-cli src --check",
+		"formatting": "prettier src --check",
 		"lint": "eslint src",
 		"test": "bun test src",
 		"make": "tsgo -d"
@@ -19,13 +19,15 @@
 	"author": "Jonny Burger <jonny@remotion.dev>",
 	"license": "SEE LICENSE IN LICENSE.md",
 	"dependencies": {
+		"@rspack/core": "1.7.6",
+		"@rspack/plugin-react-refresh": "1.6.1",
 		"css-loader": "5.2.7",
 		"esbuild": "0.25.0",
 		"react-refresh": "0.9.0",
-		"remotion": "4.0.424",
-		"@remotion/studio": "4.0.424",
-		"@remotion/studio-shared": "4.0.424",
-		"@remotion/media-parser": "4.0.424",
+		"remotion": "4.0.426",
+		"@remotion/studio": "4.0.426",
+		"@remotion/studio-shared": "4.0.426",
+		"@remotion/media-parser": "4.0.426",
 		"style-loader": "4.0.0",
 		"source-map": "0.7.3",
 		"webpack": "5.105.0"
@@ -37,7 +39,7 @@
 	"devDependencies": {
 		"react": "19.2.3",
 		"react-dom": "19.2.3",
-		"@remotion/eslint-config-internal": "4.0.424",
+		"@remotion/eslint-config-internal": "4.0.426",
 		"eslint": "9.19.0",
 		"@typescript/native-preview": "7.0.0-dev.20260217.1"
 	},