Skip to main content

watchStaticFile()v4.0.61

note

This API is being moved to the @remotion/studio package. Prefer importing the API from @remotion/studio instead of remotion.

Watches for changes in a specific static file and invokes a callback function when the file changes, enabling dynamic updates in your Remotion projects.

danger

This feature is only available within the Remotion Studio environment. In the Player, events will never fire.

Example​

example.tsx
tsx
import { StaticFile, watchStaticFile } from "remotion";
 
// Watch for changes in a specific static file
const { cancel } = watchStaticFile(
  "your-static-file.jpg",
  (newData: StaticFile | null) => {
    if (newData) {
      console.log(`File ${newData.name} has been added or modified.`);
    } else {
      console.log("File has been deleted.");
    }
  },
);
 
// To stop watching for changes, call the cancel function
cancel();
example.tsx
tsx
import { StaticFile, watchStaticFile } from "remotion";
 
// Watch for changes in a specific static file
const { cancel } = watchStaticFile(
  "your-static-file.jpg",
  (newData: StaticFile | null) => {
    if (newData) {
      console.log(`File ${newData.name} has been added or modified.`);
    } else {
      console.log("File has been deleted.");
    }
  },
);
 
// To stop watching for changes, call the cancel function
cancel();

Arguments​

Takes two arguments and returns a function that can be used to cancel the event listener.

filename​

A name of the file in /public folder to watch for changes.

callback​

A callback function that will be called when the file is modified. As an argument, a StaticFile or null is passed.

See also​