remotion-dev/remotion · error · TypeError
No `src` was passed to <NewAudioForPreview>.
Error message
No `src` was passed to <NewAudioForPreview>.
What it means
Thrown by <NewAudioForPreview> in @remotion/media when the `src` prop is falsy during Studio preview. The internal preview component needs a concrete URL to preload and play audio, so an empty/undefined source is a hard error rather than silent silence.
Source
Thrown at packages/media/src/audio/audio-for-preview.tsx:113
const volumePropFrame = useFrameForVolumeProp(
loopVolumeCurveBehavior ?? 'repeat',
);
const userPreferredVolume = evaluateVolume({
frame: volumePropFrame,
volume,
mediaVolume,
});
warnAboutTooHighVolume(userPreferredVolume);
if (!videoConfig) {
throw new Error('No video config found');
}
if (!src) {
throw new TypeError('No `src` was passed to <NewAudioForPreview>.');
}
const currentTime = frame / videoConfig.fps;
const currentTimeRef = useRef(currentTime);
currentTimeRef.current = currentTime;
const preloadedSrc = usePreload(src);
const parentSequence = useContext(SequenceContext);
const isPremounting = Boolean(parentSequence?.premounting);
const isPostmounting = Boolean(parentSequence?.postmounting);
const sequenceOffset = (parentSequence?.absoluteFrom ?? 0) / videoConfig.fps;
const bufferingContext = useContext(Internals.BufferingContextReact);
if (!bufferingContext) {
throw new Error(View on GitHub (pinned to 78fe4bb3fd)
Solutions
- Provide a non-empty string src: <Audio src={staticFile('audio.mp3')} />.
- If audio is optional, conditionally render the component: {src && <Audio src={src} />}.
- Verify the src variable is populated before the composition renders (check the prop value in Studio).
Example fix
// before
<Audio src={audioUrl} /> // audioUrl may be undefined during preview
// after
{audioUrl ? <Audio src={audioUrl} /> : null} Defensive patterns
Strategy: validation
Validate before calling
const audioSrc = typeof src === 'string' && src.length > 0 ? src : null;
return audioSrc ? <Audio src={audioSrc} /> : null; Type guard
const isNonEmptyString = (v: unknown): v is string => typeof v === 'string' && v.trim().length > 0;
Prevention
- Conditionally render <Audio> only when src is a non-empty string.
- Resolve all staticFile() paths at module load so they are never undefined during preview.
- Type optional audio props and default them before reaching the component.
When it happens
Trigger: Rendering <Audio src={undefined} />, <Audio src={''} />, or <Audio src={null} /> inside a composition that runs in Remotion Studio preview. Typically the src is bound to a variable that is not yet populated (e.g. a staticFile path computed conditionally).
Common situations: Loading audio src from props that are optional and not yet set, building src from a template that yields empty string, or forgetting to call staticFile() on an asset that lives in public/.
Related errors
- No `src` was passed to <Audio>.
- The `<Audio>` tag requires a string for `src`, but got ${JSO
- No 'src' was passed to <Html5Audio>.
- No src passed
- No src passed
AI-assisted analysis of remotion-dev/remotion@78fe4bb3fd (2026-08-12).
Data as JSON: /api/errors/ab34f342a35f79c9.
Report an issue: GitHub.