Skip to main content

bundle()

Part of the @remotion/bundler package.

Bundles a Remotion project using Webpack and prepares it for render using renderMedia().

ts
const bundle: (
  entryPoint: string,
  onProgressUpdate?: (progress: number) => void,
  options?: {
    webpackOverride?: WebpackOverrideFn;
    outDir?: string;
    enableCaching?: boolean;
    publicPath?: string;
  }
) => Promise<string>;
ts
const bundle: (
  entryPoint: string,
  onProgressUpdate?: (progress: number) => void,
  options?: {
    webpackOverride?: WebpackOverrideFn;
    outDir?: string;
    enableCaching?: boolean;
    publicPath?: string;
  }
) => Promise<string>;

Arguments​

entryPoint​

A string containing an absolute path of the entry point of a Remotion project. In a default Remotion project created with the template, the entry point is located at src/index.tsx.

onProgressUpdate?​

A callback function that notifies about the progress of the Webpack bundling. Passes a number between 0 and 100. Example function:

ts
const onProgressUpdate = (progress: number) => {
  console.log(`Webpack bundling progress: ${progress}%`);
};
ts
const onProgressUpdate = (progress: number) => {
  console.log(`Webpack bundling progress: ${progress}%`);
};

options​

An object containing the following keys:

webpackOverride?​

optional

A function to override the webpack config reducer-style. Takes a function which gives you the current webpack config which you can transform and return a modified version of it. For example:

ts
const webpackOverride: WebpackOverrideFn = (webpackConfig) => {
  return {
    ...webpackConfig,
    // Override properties
  };
};
ts
const webpackOverride: WebpackOverrideFn = (webpackConfig) => {
  return {
    ...webpackConfig,
    // Override properties
  };
};

outDir?​

optional

Specify a desired output directory. If no passed, the webpack bundle will be created in a temp dir.

enableCaching?​

optional

A boolean specifying whether Webpack caching should be enabled. Default true, it is recommended to leave caching enabled at all times since file changes should be recognized by Webpack nonetheless.

publicPath?​

optional

The path of the URL where the bundle is going to be hosted. By default it is /, meaning that the bundle is going to be hosted at the root of the domain (e.g. https://localhost:3000/). In some cases like rendering on Lambda, the public path might be a subdirectory.

Return value​

A promise which will resolve into a string specifying the output directory.

See also​