remotion-dev/remotion · error · Error
Browser Studio Remotion version is unavailable
Error message
Browser Studio Remotion version is unavailable
What it means
Thrown by the dependency resolver inside the <BrowserStudio> React component. Every @remotion/* package installed into the virtual project must be pinned to one Remotion version, taken from remotionPackageSource.version when remotionPackageSource.type === 'release', otherwise from the build-time injected browserStudioDependencyVersions.remotion record (__BROWSER_STUDIO_DEPENDENCY_VERSIONS__). If neither source yields a version, dependency resolution cannot proceed and this error is thrown.
Source
Thrown at packages/browser-studio/src/BrowserStudio.tsx:276
const updateProject = useCallback(
(nextProject: BrowserStudioProps['project']) => {
activeProjectRef.current = nextProject;
setEditedProject({
project: nextProject,
sourceProject: incomingProjectRef.current,
});
onProjectChangeRef.current?.(nextProject);
},
[],
);
const resolveElementDependencies = useCallback(
(dependencies: readonly {name: string; version: string | null}[]) => {
const remotionVersion =
remotionPackageSource?.type === 'release'
? remotionPackageSource.version
: browserStudioDependencyVersions.remotion;
if (!remotionVersion) {
throw new Error('Browser Studio Remotion version is unavailable');
}
const versions: Record<string, string> = {};
const resolutions: Record<string, BrowserStudioDependencyResolution> = {};
for (const dependency of dependencies) {
const requestedVersion = dependency.name.startsWith('@remotion/')
? remotionVersion
: dependency.version;
const customResolution = dependencyResolverRef.current?.({
name: dependency.name,
version: requestedVersion,
});
const customVersion =
typeof customResolution === 'string' &&
!customResolution.startsWith('http')
? customResolution
: typeof customResolution === 'object'
? (customResolution?.version ?? null)View on GitHub (pinned to b2f4e34732)
Solutions
- Pass remotionPackageSource={{type: 'release', baseUrl, version}} to <BrowserStudio> with a concrete published version.
- If building from source, inject __BROWSER_STUDIO_DEPENDENCY_VERSIONS__ (see dev/get-dependency-versions-for-build.ts) with a 'remotion' entry via your bundler's define/globals.
- Consume the published artifact instead of raw source so the build-time version inject is present.
Example fix
// before
<BrowserStudio project={project} readOnly={false} />
// after
<BrowserStudio
project={project}
readOnly={false}
remotionPackageSource={{
type: 'release',
baseUrl: 'https://esm.sh',
version: '4.0.0',
}}
/> Defensive patterns
Strategy: validation
Validate before calling
import type {BrowserStudioRemotionPackageSource} from '@remotion/browser-studio';
const isReleaseSource = (
source: BrowserStudioRemotionPackageSource | undefined,
): source is {type: 'release'; baseUrl: string; version: string} =>
source?.type === 'release' && source.version.length > 0;
// Before enabling any package-install / element-install flow:
if (!isReleaseSource(remotionPackageSource)) {
// versions then depend on the build-time inject; verify it exists in your build
// before allowing installs, otherwise surface a config error to the user.
} Type guard
const isReleaseSource = (
source: BrowserStudioRemotionPackageSource | undefined,
): source is {type: 'release'; baseUrl: string; version: string} =>
source?.type === 'release' && source.version.length > 0; Try / catch
try {
await operations.packageInstallation.installPackages({dependencies});
} catch (error) {
if (error instanceof Error && error.message.includes('Remotion version is unavailable')) {
// surface a host configuration error: fix remotionPackageSource or the build inject
}
throw error;
} Prevention
- Always pass remotionPackageSource={{type: 'release', ...}} when self-hosting.
- Add a build-time assertion that __BROWSER_STUDIO_DEPENDENCY_VERSIONS__ contains a 'remotion' key.
- Disable install UI until a Remotion version source is confirmed available.
When it happens
Trigger: Any operation that resolves dependencies (installPackages, addEffect whose import path maps to an @remotion/* package, element install flows) while remotionPackageSource is undefined or {type: 'workspace'} AND the injected dependency-version record has no 'remotion' entry.
Common situations: Self-hosting @remotion/browser-studio from source with a custom bundler that skips the __BROWSER_STUDIO_DEPENDENCY_VERSIONS__ define/inject step; using a workspace (dev) remotionPackageSource in an embed built without the version inject; stale custom build config after upgrading the package.
Related errors
- Cannot resolve ${dependency.name} because the Browser Studio
- No published version is known for ${name}
- The repository package ${packageName} does not expose ${subp
- Only HTTP(S) URLs can be imported
- Remote asset URLs cannot include credentials
AI-assisted analysis of remotion-dev/remotion@b2f4e34732 (2026-08-22).
Data as JSON: /api/errors/665b4771a2fd00ed.
Report an issue: GitHub.