remotion-dev/remotion · critical · Error

Remotion requires React.createContext, but it is "undefined"

Error message

Remotion requires React.createContext, but it is "undefined".
If you are in a React Server Component, turn it into a client component by adding "use client" at the top of the file.

Before:
  import {useCurrentFrame} from "remotion";

After:
  "use client";
  import {useCurrentFrame} from "remotion";

What it means

Thrown at module load time when React.createContext is undefined. This happens inside React Server Components (RSC) where React hooks and context APIs are not available. The message instructs adding the "use client" directive.

Source

Thrown at packages/core/src/_check-rsc.ts:16

import {createContext} from 'react';

if (typeof createContext !== 'function') {
	const err = [
		'Remotion requires React.createContext, but it is "undefined".',
		'If you are in a React Server Component, turn it into a client component by adding "use client" at the top of the file.',
		'',
		'Before:',
		'  import {useCurrentFrame} from "remotion";',
		'',
		'After:',
		'  "use client";',
		'  import {useCurrentFrame} from "remotion";',
	];

	throw new Error(err.join('\n'));
}

View on GitHub (pinned to 78fe4bb3fd)

Solutions

1. Add "use client" as the first line of the file importing remotion.
2. Move the remotion import into a dedicated client component and import that component from the server file.
3. Ensure your bundler is not stripping React's createContext (check for multiple React versions).

Example fix

// before
import {useCurrentFrame} from "remotion";
export const MyComp = () => {
  const f = useCurrentFrame();
  return <div>{f}</div>;
};

// after
"use client";
import {useCurrentFrame} from "remotion";
export const MyComp = () => {
  const f = useCurrentFrame();
  return <div>{f}</div>;
};

// At top of any file importing remotion in an RSC framework:
// 'use client';
// Must be the very first statement.

When it happens

Trigger: Importing anything from remotion in a Next.js App Router server component (or any RSC framework) without the "use client" directive at the top of the file.

Common situations: Using remotion in a Next.js 13+ app router page/layout without marking it as a client component; importing remotion utilities from a server-side data-fetching module.

Related errors

• <Clipper> has been removed as of Remotion v4.0.228. The nati
• <Composition> was mounted inside the `component` that was pa
• <Composition> mounted inside another composition. See https:
• HtmlInCanvas: `pixelDensity` must be a positive finite numbe
• The "freeze" prop is not supported on <Html5Audio />. Use <S

AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12). Data as JSON: /api/errors/35b7eed9b0e92eb4. Report an issue: GitHub.