@remotion/bundler 4.0.0-webhook.26 → 4.1.0-alpha1

package/dist/validate-public-dir.js

@@ -4,15 +4,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.validatePublicDir = void 0;
-const fs_1 = __importDefault(require("fs"));
-const path_1 = __importDefault(require("path"));
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_path_1 = __importDefault(require("node:path"));
 const validatePublicDir = (p) => {
-    const { root } = path_1.default.parse(process.cwd());
+    const { root } = node_path_1.default.parse(process.cwd());
     if (p === root) {
         throw new Error(`The public directory was specified as "${p}", which is the root directory. This is not allowed.`);
     }
     try {
-        const stat = fs_1.default.lstatSync(p);
+        const stat = node_fs_1.default.lstatSync(p);
         if (!stat.isDirectory()) {
             throw new Error(`The public directory was specified as "${p}", and while this path exists on the filesystem, it is not a directory.`);
         }
@@ -20,8 +20,8 @@ const validatePublicDir = (p) => {
     catch (e) {
         // Path does not exist
         // Check if the parent path exists
-        const parentPath = path_1.default.dirname(p);
-        const exists = fs_1.default.existsSync(parentPath);
+        const parentPath = node_path_1.default.dirname(p);
+        const exists = node_fs_1.default.existsSync(parentPath);
         if (!exists) {
             throw new Error(`The public directory was specified as "${p}", but this folder does not exist and the parent directory "${parentPath}" does also not exist. Create at least the parent directory.`);
         }

package/dist/webpack-cache.d.ts

@@ -1,5 +1,5 @@
-declare type Environment = 'development' | 'production';
-declare type CacheState = 'exists' | 'other-exists' | 'does-not-exist';
+type Environment = 'development' | 'production';
+type CacheState = 'exists' | 'other-exists' | 'does-not-exist';
 declare global {
     namespace NodeJS {
         interface ProcessVersions {
@@ -7,7 +7,8 @@ declare global {
         }
     }
 }
-export declare const clearCache: (remotionRoot: string) => Promise<void>;
+export declare const clearCache: (remotionRoot: string, env: Environment) => Promise<void>;
+export declare const getWebpackCacheEnvDir: (environment: Environment) => string;
 export declare const getWebpackCacheName: (environment: Environment, hash: string) => string;
 export declare const cacheExists: (remotionRoot: string, environment: Environment, hash: string) => CacheState;
 export {};

package/dist/webpack-cache.js

@@ -3,22 +3,22 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.cacheExists = exports.getWebpackCacheName = exports.clearCache = void 0;
-const fs_1 = __importDefault(require("fs"));
-const path_1 = __importDefault(require("path"));
+exports.cacheExists = exports.getWebpackCacheName = exports.getWebpackCacheEnvDir = exports.clearCache = void 0;
+const node_fs_1 = __importDefault(require("node:fs"));
+const node_path_1 = __importDefault(require("node:path"));
 // Inlined from https://github.com/webpack/webpack/blob/4c2ee7a4ddb8db2362ca83b6c4190523387ba7ee/lib/config/defaults.js#L265
 // An algorithm to determine where Webpack will cache the depencies
 const getWebpackCacheDir = (remotionRoot) => {
     let dir = remotionRoot;
     for (;;) {
         try {
-            if (fs_1.default.statSync(path_1.default.join(dir, 'package.json')).isFile()) {
+            if (node_fs_1.default.statSync(node_path_1.default.join(dir, 'package.json')).isFile()) {
                 break;
             }
             // eslint-disable-next-line no-empty
         }
         catch (e) { }
-        const parent = path_1.default.dirname(dir);
+        const parent = node_path_1.default.dirname(dir);
         if (dir === parent) {
             dir = undefined;
             break;
@@ -26,40 +26,41 @@ const getWebpackCacheDir = (remotionRoot) => {
         dir = parent;
     }
     if (!dir) {
-        return path_1.default.resolve(remotionRoot, '.cache/webpack');
+        return node_path_1.default.resolve(remotionRoot, '.cache/webpack');
     }
     if (process.versions.pnp === '1') {
-        return path_1.default.resolve(dir, '.pnp/.cache/webpack');
+        return node_path_1.default.resolve(dir, '.pnp/.cache/webpack');
     }
     if (process.versions.pnp === '3') {
-        return path_1.default.resolve(dir, '.yarn/.cache/webpack');
+        return node_path_1.default.resolve(dir, '.yarn/.cache/webpack');
     }
-    return path_1.default.resolve(dir, 'node_modules/.cache/webpack');
+    return node_path_1.default.resolve(dir, 'node_modules/.cache/webpack');
+};
+const remotionCacheLocationForEnv = (remotionRoot, environment) => {
+    return node_path_1.default.join(getWebpackCacheDir(remotionRoot), (0, exports.getWebpackCacheEnvDir)(environment));
 };
 const remotionCacheLocation = (remotionRoot, environment, hash) => {
-    return path_1.default.join(getWebpackCacheDir(remotionRoot), (0, exports.getWebpackCacheName)(environment, hash));
+    return node_path_1.default.join(getWebpackCacheDir(remotionRoot), (0, exports.getWebpackCacheName)(environment, hash));
 };
-const clearCache = (remotionRoot) => {
-    var _a;
-    return ((_a = fs_1.default.promises.rm) !== null && _a !== void 0 ? _a : fs_1.default.promises.rmdir)(getWebpackCacheDir(remotionRoot), {
+const clearCache = (remotionRoot, env) => {
+    return node_fs_1.default.promises.rm(remotionCacheLocationForEnv(remotionRoot, env), {
         recursive: true,
     });
 };
 exports.clearCache = clearCache;
 const getPrefix = (environment) => {
-    return `remotion-v4-${environment}`;
+    return `remotion-v5-${environment}`;
+};
+const getWebpackCacheEnvDir = (environment) => {
+    return getPrefix(environment);
 };
+exports.getWebpackCacheEnvDir = getWebpackCacheEnvDir;
 const getWebpackCacheName = (environment, hash) => {
-    if (environment === 'development') {
-        return `${getPrefix(environment)}-${hash}`;
-    }
-    // In production, the cache is independent from input props because
-    // they are passed over URL params. Speed is mostly important in production.
-    return `${getPrefix(environment)}-${hash}`;
+    return [(0, exports.getWebpackCacheEnvDir)(environment), hash].join(node_path_1.default.sep);
 };
 exports.getWebpackCacheName = getWebpackCacheName;
 const hasOtherCache = ({ remotionRoot, environment, }) => {
-    const cacheDir = fs_1.default.readdirSync(getWebpackCacheDir(remotionRoot));
+    const cacheDir = node_fs_1.default.readdirSync(getWebpackCacheDir(remotionRoot));
     if (cacheDir.find((c) => {
         return c.startsWith(getPrefix(environment));
     })) {
@@ -68,10 +69,10 @@ const hasOtherCache = ({ remotionRoot, environment, }) => {
     return false;
 };
 const cacheExists = (remotionRoot, environment, hash) => {
-    if (fs_1.default.existsSync(remotionCacheLocation(remotionRoot, environment, hash))) {
+    if (node_fs_1.default.existsSync(remotionCacheLocation(remotionRoot, environment, hash))) {
         return 'exists';
     }
-    if (!fs_1.default.existsSync(getWebpackCacheDir(remotionRoot))) {
+    if (!node_fs_1.default.existsSync(getWebpackCacheDir(remotionRoot))) {
         return 'does-not-exist';
     }
     if (hasOtherCache({ remotionRoot, environment })) {

package/dist/webpack-config.d.ts

@@ -1,15 +1,17 @@
-import type { WebpackConfiguration, WebpackOverrideFn } from 'remotion';
-export declare const webpackConfig: ({ entry, userDefinedComponent, outDir, environment, webpackOverride, onProgress, enableCaching, envVariables, maxTimelineTracks, entryPoints, remotionRoot, keyboardShortcutsEnabled, }: {
+import type { Configuration } from 'webpack';
+export type WebpackConfiguration = Configuration;
+export type WebpackOverrideFn = (currentConfiguration: WebpackConfiguration) => WebpackConfiguration;
+export declare const webpackConfig: ({ entry, userDefinedComponent, outDir, environment, webpackOverride, onProgress, enableCaching, maxTimelineTracks, entryPoints, remotionRoot, keyboardShortcutsEnabled, poll, }: {
     entry: string;
     userDefinedComponent: string;
-    outDir: string;
+    outDir: string | null;
     environment: 'development' | 'production';
     webpackOverride: WebpackOverrideFn;
     onProgress?: ((f: number) => void) | undefined;
     enableCaching?: boolean | undefined;
-    envVariables: Record<string, string>;
     maxTimelineTracks: number;
     keyboardShortcutsEnabled: boolean;
     entryPoints: string[];
     remotionRoot: string;
+    poll: number | null;
 }) => [string, WebpackConfiguration];

package/dist/webpack-config.js

@@ -27,14 +27,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.webpackConfig = void 0;
-const crypto_1 = require("crypto");
+const node_crypto_1 = require("node:crypto");
 const react_dom_1 = __importDefault(require("react-dom"));
-const remotion_1 = require("remotion");
 const webpack_1 = __importStar(require("webpack"));
 const fast_refresh_1 = require("./fast-refresh");
+const stringify_with_circular_references_1 = require("./stringify-with-circular-references");
 const webpack_cache_1 = require("./webpack-cache");
 const esbuild = require("esbuild");
-if (!react_dom_1.default || !react_dom_1.default.version) {
+const remotion_1 = require("remotion");
+const optional_dependencies_1 = require("./optional-dependencies");
+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];
@@ -50,7 +52,7 @@ const esbuildLoaderOptions = {
 function truthy(value) {
     return Boolean(value);
 }
-const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpackOverride = (f) => f, onProgress, enableCaching = true, envVariables, maxTimelineTracks, entryPoints, remotionRoot, keyboardShortcutsEnabled, }) => {
+const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpackOverride = (f) => f, onProgress, enableCaching = true, maxTimelineTracks, entryPoints, remotionRoot, keyboardShortcutsEnabled, poll, }) => {
     const conf = webpackOverride({
         optimization: {
             minimize: false,
@@ -63,12 +65,11 @@ const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpa
                 },
         },
         watchOptions: {
+            poll: poll !== null && poll !== void 0 ? poll : undefined,
             aggregateTimeout: 0,
             ignored: ['**/.git/**', '**/node_modules/**'],
         },
-        devtool: environment === 'development'
-            ? 'cheap-module-source-map'
-            : 'cheap-module-source-map',
+        devtool: 'cheap-module-source-map',
         entry: [
             // Fast Refresh must come first,
             // because setup-environment imports ReactDOM.
@@ -90,8 +91,8 @@ const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpa
                 new webpack_1.default.DefinePlugin({
                     'process.env.MAX_TIMELINE_TRACKS': maxTimelineTracks,
                     'process.env.KEYBOARD_SHORTCUTS_ENABLED': keyboardShortcutsEnabled,
-                    [`process.env.${remotion_1.Internals.ENV_VARIABLES_ENV_NAME}`]: JSON.stringify(envVariables),
                 }),
+                new optional_dependencies_1.AllowOptionalDependenciesPlugin(),
             ]
             : [
                 new webpack_1.ProgressPlugin((p) => {
@@ -99,16 +100,16 @@ const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpa
                         onProgress(Number((p * 100).toFixed(2)));
                     }
                 }),
+                new optional_dependencies_1.AllowOptionalDependenciesPlugin(),
             ],
         output: {
             hashFunction: 'xxhash64',
-            globalObject: 'this',
-            filename: 'bundle.js',
+            filename: remotion_1.Internals.bundleName,
             devtoolModuleFilenameTemplate: '[resource-path]',
             assetModuleFilename: environment === 'development' ? '[path][name][ext]' : '[hash][ext]',
         },
         resolve: {
-            extensions: ['.ts', '.tsx', '.js', '.jsx'],
+            extensions: ['.ts', '.tsx', '.web.js', '.js', '.jsx'],
             alias: {
                 // Only one version of react
                 'react/jsx-runtime': require.resolve('react/jsx-runtime'),
@@ -117,7 +118,6 @@ const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpa
                     ? require.resolve('react-dom/client')
                     : require.resolve('react-dom'),
                 remotion: require.resolve('remotion'),
-                'react-native$': 'react-native-web',
             },
         },
         module: {
@@ -168,7 +168,9 @@ const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpa
             ],
         },
     });
-    const hash = (0, crypto_1.createHash)('md5').update(JSON.stringify(conf)).digest('hex');
+    const hash = (0, node_crypto_1.createHash)('md5')
+        .update((0, stringify_with_circular_references_1.jsonStringifyWithCircularReferences)(conf))
+        .digest('hex');
     return [
         hash,
         {
@@ -182,7 +184,7 @@ const webpackConfig = ({ entry, userDefinedComponent, outDir, environment, webpa
                 : false,
             output: {
                 ...conf.output,
-                path: outDir,
+                ...(outDir ? { path: outDir } : {}),
             },
             context: remotionRoot,
         },

package/package.json

@@ -1,68 +1,65 @@
 {
-	"name": "@remotion/bundler",
-	"version": "4.0.0-webhook.26+c8e41db11",
-	"description": "Bundler for Remotion",
-	"main": "dist/index.js",
-	"sideEffects": false,
-	"repository": {
-		"url": "https://github.com/remotion-dev/remotion"
-	},
-	"bugs": {
-		"url": "https://github.com/remotion-dev/remotion/issues"
-	},
-	"scripts": {
-		"lint": "eslint src --ext ts,tsx",
-		"build": "tsc -d",
-		"watch": "tsc -w",
-		"test": "vitest --run"
-	},
-	"files": [
-		"dist",
-		"react-shim.js"
-	],
-	"author": "",
-	"license": "SEE LICENSE IN LICENSE.md",
-	"dependencies": {
-		"css-loader": "5.2.7",
-		"esbuild": "0.14.19",
-		"react-refresh": "0.9.0",
-		"remotion": "4.0.0-webhook.26+c8e41db11",
-		"style-loader": "2.0.0",
-		"webpack": "5.74.0"
-	},
-	"peerDependencies": {
-		"react": ">=16.8.0",
-		"react-dom": ">=16.8.0"
-	},
-	"devDependencies": {
-		"@jonny/eslint-config": "3.0.266",
-		"@types/node": "^16.7.5",
-		"@types/react": "18.0.1",
-		"@types/react-dom": "18.0.0",
-		"@types/webpack-env": "^1.16.0",
-		"@typescript-eslint/eslint-plugin": "5.18.0",
-		"@typescript-eslint/parser": "5.18.0",
-		"eslint": "8.13.0",
-		"eslint-plugin-10x": "1.5.2",
-		"eslint-plugin-react": "7.29.4",
-		"eslint-plugin-react-hooks": "4.4.0",
-		"prettier": "^2.0.5",
-		"prettier-plugin-organize-imports": "^2.3.4",
-		"react": "^18.0.0",
-		"react-dom": "^18.0.0",
-		"typescript": "^4.7.0",
-		"vitest": "^0.18.0"
-	},
-	"keywords": [
-		"remotion",
-		"ffmpeg",
-		"video",
-		"react",
-		"puppeteer",
-		"player"
-	],
-	"publishConfig": {
-		"access": "public"
-	},
-	"gitHead": "c8e41db114d645c5183edbf016a22b733243dce2"
-}
+  "name": "@remotion/bundler",
+  "version": "4.1.0-alpha1",
+  "description": "Bundler for Remotion",
+  "main": "dist/index.js",
+  "sideEffects": false,
+  "repository": {
+    "url": "https://github.com/remotion-dev/remotion"
+  },
+  "bugs": {
+    "url": "https://github.com/remotion-dev/remotion/issues"
+  },
+  "files": [
+    "dist",
+    "react-shim.js"
+  ],
+  "author": "Jonny Burger <jonny@remotion.dev>",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "dependencies": {
+    "css-loader": "5.2.7",
+    "esbuild": "0.16.12",
+    "react-refresh": "0.9.0",
+    "style-loader": "2.0.0",
+    "webpack": "5.83.1",
+    "remotion": "4.1.0-alpha1"
+  },
+  "peerDependencies": {
+    "react": ">=16.8.0",
+    "react-dom": ">=16.8.0"
+  },
+  "devDependencies": {
+    "@jonny/eslint-config": "3.0.266",
+    "@types/node": "18.14.6",
+    "@types/react": "18.0.26",
+    "@types/react-dom": "18.0.10",
+    "eslint": "8.42.0",
+    "eslint-plugin-10x": "1.5.2",
+    "eslint-plugin-react": "7.29.4",
+    "eslint-plugin-react-hooks": "4.4.0",
+    "prettier": "^2.7.1",
+    "prettier-plugin-organize-imports": "^2.3.4",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "typescript": "4.9.5",
+    "vitest": "0.31.1"
+  },
+  "keywords": [
+    "remotion",
+    "ffmpeg",
+    "video",
+    "react",
+    "webpack",
+    "player"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "formatting": "prettier src --check",
+    "lint": "eslint src --ext ts,tsx",
+    "build": "tsc -d",
+    "watch": "tsc -w",
+    "test": "vitest --run"
+  }
+}

package/react-shim.js

@@ -1,3 +1,7 @@
 import * as React from 'react';
 
-window.React = React;
+if (typeof globalThis === 'undefined') {
+	window.React = React;
+} else {
+	globalThis.React = React;
+}