如何防止 Jekyll 为源元素生成结束标记？

Question

MDN 文档在

<source>

html 元素上声明以下内容；

HTML 元素为 、 元素 或 元素指定了多种媒体资源。它是一个 void 元素，意味着它没有内容，也没有结束标记。

但是，根据文档，Jekyll 生成了一个结束的

</source>

标签，这是不正确的。

我的模板中有以下内容：

<source src="{{ item.gif-mp4 }}" type="video/mp4" />

产生：

<source src="/assets/uploads/the-blade.mp4" type="video/mp4"></source>

我该如何解决？

我尝试使用不同的降价处理器，如 redcarpet，根据他们的文档，它应该能够删除标签，但 Jekyll 不会使用它说的。

更新：以下是更多上下文：

<video-js
      class="vjs-fluid"
      data-setup='{"controls": false, "preload": "auto", "muted": true, "autoplay": false, "loop": false, "playsinline": true}'
      poster="{{ item.image }}">
      <source src="{{ item.gif-webm }}" type="video/webm" />
      <source src="{{ item.gif-mp4 }}" type="video/mp4" />
      <p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports html5 video</p>
</video-js>

我也试过没有

/>

，所以只是

>

<source src="{{ item.gif-webm }}" type="video/webm">
<source src="{{ item.gif-mp4 }}" type="video/mp4">

但这给了我一个更奇怪的输出，它将结束源标签放在段落后面：

<video-js
  class="vjs-fluid"
  data-setup='{"controls": false, "preload": "auto", "muted": true, "autoplay": false, "loop": false, "playsinline": true}'
  poster="/assets/uploads/poster.jpg">
  <source src="/assets/uploads/video.webm" type="video/webm" />
  <source src="/assets/uploads/video.mp4" type="video/mp4" />
  <p class="vjs-no-js">
    To view this video please enable JavaScript, and consider upgrading to a web
    browser that supports html5 video
  </p>
</source>
</source>
</video-js>

注意段落后面的来源标签以及开始标签中的

/>

。

不过我想指出的是，浏览器删除了这些结束标签，生产站点没有显示任何错误，但它仍然很奇怪，而且 validator.org 确实注意到了所有错误。

Answer 1

正确的标签应该是：

<source src="{{ item.gif-mp4 }}" type="video/mp4">

注意

/

之后没有斜线

type="video/mp4"

.