samedi 17 juillet 2021

React load video that does not exist at compile time

In a local web application, the server receives videos from other remote sources during runtime. The React application is supposed to offer a preview of these videos. The problem is that the videos do not exist during compilation, so using require or import dynamically does not work and gives a Cannot load module '<path>' error. The video path is correct, but it cannot import the video dynamically.

From the React functional component:

const [video, setVideo] = useState(null)

useEffect(() => {
   if (videoURL)
       video = require(videoURL)
}, [videoURL]}

videoURL is passed from the parent.

This is the JSX code:

{video?        
    <ReactPlayer controls url={video} /> : <> </>
}



Aucun commentaire:

Enregistrer un commentaire