ReactJS Video - Range Not Satisfiable Error

I'm trying to play a local video from my react component and it's throwing the following error when this component is loaded:

RangeNotSatisfiableError: Range Not Satisfiable

import React from 'react';

const Video = () => {
  const path = `${process.env.PUBLIC_URL}/media/videos/sample.mp4`;

  return (
    <video muted autoPlay>
      <source src={path} type='video/mp4' />
    </video>
  );
}

export default Video;

Any ideas why this would be happening and how I can resolve this? Thanks!