Docusaurus 2 在 Markdown 文件中包含视频文件

Question

使用 Docusaurus 获取帮助文档。我可以包含图像、GIF 并引用 YouTube 视频（使用 iframe）。但我不清楚如何将视频包含在 Markdown 文件中。

我希望视频出现在我的存储库中（即 src="./assets/my-video.mp4" type=video/mp4"）。

关于这个问题已经有过讨论，但我找不到引用视频的简单示例。

Answer 1

您需要安装react-player，创建一个扩展名的文件.mdx并添加视频。

\n

1）安装react-player：

\n

\n
npm 安装反应播放器
\n

\n

2)例如Intro.mdx，在您的文件中，在顶部插入（如果存在，则在---下面）：

\n

import ReactPlayer from \'react-player\'\n

然后将视频插入到您想要的任何位置：

\n

<ReactPlayer playing controls url=\'video.mp4\' />\n

重要的

\n

我在尝试使用相对路径渲染视频时遇到一些问题。因此，也许更好地将它们放在static文件夹中，然后调用 using <ReactPlayer playing controls url=\'/video.mp4\' />（注意/文件名之前的）。
\n
我忘记将扩展名更改为mdx. 但它工作得很好md但它与扩展文件
\n

\n

参考

\n

\n

注意：使用参考#3 了解有关反应播放器的更多信息！您可以在视频播放器上使用很多很酷的东西。

\n

免责声明

\n

就像endiliey在您的参考链接中所说的那样，对于熟悉该技术的人来说，这是超级简单的 \xe2\x80\x94 。这不是我的情况\xe2\x80\xa6 但了解它很有趣！

\n

Answer 2

您可以react-player按照 D.Kastier 建议使用库，但也可以使用video标签。

0. 什么不起作用

<video controls>
  <source src="./up%20nd%20down.mp4"/>
</video>
<video controls>
  <source src="./up and down.mp4"/>
</video>

import upAndDownURL from './up and down.mp4';

<video controls>
  <source src={upAndDownURL}/>
</video>

小心！import upAndDownURL from './up%20and%20down.mp4';不管用。

myVideo.avi需要放在<project_root>/static文件夹下。

<video controls>
  <source src="/myVideo.avi"/>
</video>