结合使用HTML5视频代码和create-react-app

Question

所以我有这段代码

export default () => {
    return (
        <main>
            <section className="section-home">
                <div className="bg-video">
                    <video className="bg-video__content" src="./video/pn-video.mp4" autoPlay loop>
                        <source src="./video/pn-video.mp4" type="video/mp4" />
                        <source src="./video/pn-video.webm" type="video/webm" />
                        Your browser is not supported!
                    </video>
                </div>
            </section>
        </main>
    )
}

在此项目的https://codesandbox.io/s/py2ryvrkrx的Video.js文件中，您可以看到它在没有create-react-app的情况下也可以正常工作。 然而，无处不在（包括本地和codesandbox）我试图用建立反应的应用程序内的Firefox这显示在控制台“HTTP‘text / html的‘’的’内容类型不支持媒体资源的负荷。 HTTP： //localhost:3000/video/pn-video.mp4失败。” 而且我一辈子都无法弄清楚如何添加更多的mime类型。

在此先感谢您的帮助！