Skip to main content

deploySite()

Takes a Remotion project, bundles it and uploads it to an S3 bucket. Once uploaded, a Lambda function can render any composition in the Remotion project by specifying the URL.

Note that the Remotion project will be deployed to a subdirectory, not the root of the domain. Therefore you must ensure that if you have specified paths in your Remotion project, they are able to handle this scenario.

Before calling this function, you should create a bucket, see getOrCreateBucket().

Example​

ts
import { deploySite } from "@remotion/lambda";
import path from "path";
 
const { serveUrl } = await deploySite({
  entryPoint: path.resolve(process.cwd(), "src/index.tsx"),
  bucketName: "remotionlambda-c7fsl3d",
  region: "us-east-1",
  options: {
    onBundleProgress: (progress) => {
      // Progress is between 0 and 100
      console.log(`Bundle progress: ${progress}%`);
    },
    onUploadProgress: ({
      totalFiles,
      filesUploaded,
      totalSize,
      sizeUploaded,
    }) => {
      console.log(
        `Upload progress: Total files ${totalFiles}, Files uploaded ${filesUploaded}, Total size ${totalSize}, Size uploaded ${sizeUploaded}`
      );
    },
  },
});
console.log(serveUrl);
ts
import { deploySite } from "@remotion/lambda";
import path from "path";
 
const { serveUrl } = await deploySite({
  entryPoint: path.resolve(process.cwd(), "src/index.tsx"),
  bucketName: "remotionlambda-c7fsl3d",
  region: "us-east-1",
  options: {
    onBundleProgress: (progress) => {
      // Progress is between 0 and 100
      console.log(`Bundle progress: ${progress}%`);
    },
    onUploadProgress: ({
      totalFiles,
      filesUploaded,
      totalSize,
      sizeUploaded,
    }) => {
      console.log(
        `Upload progress: Total files ${totalFiles}, Files uploaded ${filesUploaded}, Total size ${totalSize}, Size uploaded ${sizeUploaded}`
      );
    },
  },
});
console.log(serveUrl);

Arguments​

An object with the following properties:

entryPoint​

An absolute path pointing to the entry file of your Remotion project. Usually the entry file in your Remotion project is stored at src/entry.tsx.

bucketName​

The bucket to where the website will be deployed. The bucket must have been created by Remotion Lambda.

siteName​

optional

Specify the subfolder in your S3 bucket that you want the site to deploy to. If you omit this property, a new subfolder with a random name will be created. If a site already exists with the name you passed, it will be overwritten. Can only contain the following characters: 0-9, a-z, A-Z, -, !, _, ., *, ', (, )

region​

The AWS region in which the bucket resides.

options​

optional

An object with the following properties:

onBundleProgress​

optional

Callback from Webpack when the bundling has progressed. Passes a number between 0 and 100 to the callback, see example at the top of the page.

onUploadProgress​

optional

Callback function that gets called when uploading of the assets has progressed. Passes an object with the following properties to the callback:

  • totalFiles (number): Total number of files in the bundle.
  • filesUploaded (number): Number of files that have been fully uploaded so far.
  • totalSize (number): Total size in bytes of all the files in the bundle.
  • sizeUploaded (number): Amount of bytes uploaded so far.

webpackOverride​

optional

Allows to pass a custom webpack override. See bundle() -> webpackOverride for more information.

enableCaching​

optional - default true

Whether webpack caching should be enabled. See bundle() -> enableCaching for more information.

Return value​

An object with the following values:

See also​