Skip to main content

Environment variables

Available from v2.1.2.

Remotion supports environment variables being passed directly from the CLI, using a .env file and from the renderMedia() function.

Passing variables from the CLI​

If you want to pass an environment variable from the CLI, you need to prefix it with REMOTION_. This is a security feature to prevent your whole environment (which could contain sensitive information) being included in a Webpack bundle.

You can pass environment variables in development mode and while rendering. For example:

bash
REMOTION_MY_VAR=hello_world npm start
bash
REMOTION_MY_VAR=hello_world npm start

In your project, you can access the variable using process.env.REMOTION_MY_VAR.

Using a dotenv file​

Dotenv support is built in if you use the CLI.
If you use the Node.JS APIs, the .env file is not automatically read and you need to use the dotenv package yourself.

Place a .env file in the root of your project and fill it with key-value pairs.

.env
ini
MY_VAR=hello
ANOTHER_VAR=world
.env
ini
MY_VAR=hello
ANOTHER_VAR=world

In your Remotion frontend code you can read process.env to get an object of environment variables: {"MY_VAR": "hello", "ANOTHER_VAR": "world"}.

Since v4.0.110, the following locations will get automatically recognized:

You can see which config file gets read by adding a --log=verbose flag to your command and looking out for the following log:

Loaded env file from /Users/my-user/remotion-project/.env.local.
Loaded env file from /Users/my-user/remotion-project/.env.local.

You can override the location of your dotenv file using the configuration file setting or the CLI flag.

Using in Node.js APIs​

When using the Node.js APIs such as renderMedia() or renderMediaOnLambda(), the environment variables are not picked up automatically.

The reason is that one might integrate Remotion as a small part of a big application and if Remotion would read the .env file automatically and forward all variables to renders, it would lead to a security issue.

To pass environment variables while server-side-rendering, pass an object to the envVariables option of renderMedia().

If you want to read the environment variables from a .env file, use the dotenv package.

The envVariables option​

The envVariables option of renderMedia(), renderMediaOnLambda accepts an object of key-value pairs.
These values can then be read from process.env inside your React component.

The option is not for authenticating with AWS - instead, load the AWS credentials using one of the described methods above.

See also​