Skip to main content

addEffect()v4.0.528

Appends an effect to a node's inline effects array and adds its import.

warning

Draft API: This API is experimental and may change.

add-effect.ts
import {addEffect, type CodemodProject, type JsxNodeReference} from '@remotion/codemods';

declare const project: CodemodProject;
declare const node: JsxNodeReference;

const result = await addEffect({
  project,
  node,
  importName: 'blur',
  importPath: '@remotion/effects/blur',
  props: {radius: 8},
});

console.log(result);

Creates the effects attribute if missing. The JSX component must support effects at runtime. Computed effects arrays and potentially overriding spreads are rejected; packages are not installed.

Options​

project​

An in-memory CodemodProject. The input project is not mutated.

node​

A JsxNodeReference from getJsxNodes() or a previous operation. It contains filePath and nodePath.

importName​

The effect's named export, such as blur.

importPath​

The effect module. Supports @remotion/effects/*, @remotion/light-leaks, and @remotion/starburst.

props?​

Serializable effect configuration. Defaults to {}.

Return value​

A promise resolving to an object with the following properties.

project​

The updated project. Unchanged files and extra project fields are preserved.

changes​

An array of {filePath, previousContents, nextContents} file changes. A null content value indicates a created or deleted file.

nodePathRemappings​

An array of {filePath, oldNodePath, newNodePath} mappings. A null old path indicates an insertion; a null new path indicates removal. Apply these mappings to references from the input project. See node references.

insertedEffect​

The new effect reference, including its zero-based effectIndex.

Errors​

Throws or rejects when the target cannot be resolved, the requested edit is unsupported, or an option is invalid. Failed edits leave the input project unchanged.

Compatibility​

BrowsersServersEnvironments
Chrome
Firefox
Safari
Node.js
Bun
Serverless Functions

See also​