remotion-dev/remotion · error · Error
Cannot create ${relativeToRoot(componentFilePath, project.ro
Error message
Cannot create ${relativeToRoot(componentFilePath, project.rootDir)} because it already exists What it means
Thrown by the applyCodemod operation of @remotion/browser-studio when a 'new-composition' codemod tries to generate the new component file `${componentName}.tsx` next to the resolved target file, but that exact path already exists in the virtual project's file map. Browser Studio never overwrites existing files with scaffolded composition components, so it aborts the whole codemod. The error is caught inside applyCodemod and returned as `{success: false, reason}` rather than propagated.
Source
Thrown at packages/browser-studio/src/browser-studio-operations.ts:1438
const project = getProject();
const absolutePath = resolveCodemodTargetFile({
codemod,
project,
symbolicatedStack,
});
const input = project.files[absolutePath];
const {newContents} = parseAndApplyCodemod({input, codeMod: codemod});
const {output} = await formatCodemodFile({contents: newContents});
const files: Record<string, string> = {
...project.files,
[absolutePath]: output,
};
if (codemod.type === 'new-composition') {
const componentFilePath = `${dirname(absolutePath)}/${codemod.componentName}.tsx`;
if (project.files[componentFilePath] !== undefined) {
throw new Error(
`Cannot create ${relativeToRoot(componentFilePath, project.rootDir)} because it already exists`,
);
}
const componentFile = await formatCodemodFile({
contents: makeNewCompositionComponentSource(codemod.componentName),
});
files[componentFilePath] = componentFile.output;
}
const diff = simpleDiff({
oldLines: input.split('\n'),
newLines: output.split('\n'),
});
if (!dryRun) {
controller.applyMutation({
fileName: absolutePath,View on GitHub (pinned to 8f97758157)
Solutions
- Pick a different, unused componentName for the new composition
- Delete or rename the existing `<componentName>.tsx` in the project files before re-running the codemod
- List `project.files` (or use the file APIs) to confirm which paths are taken before submitting
- If you genuinely want to regenerate the file, write it yourself via the project mutation API — applyCodemod has no overwrite flag
Example fix
// before
await operations.applyCodemod({
codemod: {type: 'new-composition', componentName: 'Intro', /* ... */},
dryRun: false,
symbolicatedStack: null,
}); // fails if Intro.tsx exists
// after
const project = operations.getProject ? operations.getProject() : null;
// or track files from a project event; guard before creating
const base = `${rootDir}/src`;
if (project?.files[`${base}/Intro.tsx`] !== undefined) {
throw new Error('Pick another name, Intro.tsx already exists');
}
await operations.applyCodemod({
codemod: {type: 'new-composition', componentName: 'Intro2', /* ... */},
dryRun: false,
symbolicatedStack: null,
}); Defensive patterns
Strategy: validation
Validate before calling
const componentFilePath = `${dirOfTargetFile}/${componentName}.tsx`;
if (project.files[componentFilePath] !== undefined) {
// pick another name or delete the file first
throw new Error(`${componentFilePath} already exists`);
}
const res = await operations.applyCodemod({codemod, dryRun: false, symbolicatedStack: null});
if (!res.success) console.error(res.reason); Try / catch
applyCodemod does not throw for this case — check `res.success === false` and read `res.reason`. Only wrap for unexpected coding errors.
Prevention
- Derive componentName from the current file list and disambiguate (MyComp2) before submitting
- After any deletion flow, refresh your cached list of project files
- Treat dryRun responses as authoritative previews of whether the real call will succeed
When it happens
Trigger: Calling `applyCodemod({codemod: {type: 'new-composition', componentName: 'MyComp', ...}})` when `${dirname(targetFile)}/MyComp.tsx` is already a key in `project.files`. Note the check uses the literal componentName, so a second call with the same name after a successful first call always fails.
Common situations: User creates a composition with the same name twice in one session; a UI retry after a partial success re-submits the same componentName; componentName differs from an existing file only by letter case; a previously deleted composition left its .tsx file behind.
Understand the failure class
Background: "already exists" / EEXIST / FileAlreadyExistsException: what the 'file already exists' error means and how to fix it — this error's family across 37 libraries.
Related errors
- Could not find composition "${codemod.idToDuplicate}" to dup
- 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@8f97758157 (2026-08-22).
Data as JSON: /api/errors/9e060468a4155f38.
Report an issue: GitHub.