domexception: failed to load because no supported source was found

Browsers like Chrome throws uncaught (in promise) domexception: failed to load because no supported source was found when it is not able to load audio files from url. This sometimes happen due to unable to load inline audio files.

Solution with Code Example

The solution is to import audio at the top –

Wrong code – This code may throw error

const audio = new Audio(required('../assets/sound.mp3')) 
audio.play()

Correct Code –

import sound from '../assets/sound.mp3'
const audio = new Audio(sound)
audio.play()

If you need to dynamically import the audio file –

let sound;
// other code here
// dynamically import audio
sound = await import("../assets/sound.mp3");
const audio = new Audio(sound)
audio.play()