Question

Gitbook 插件：使用 Video.js 播放本地视频

[!TIP|style:flat|iconVisibility:hidden|labelVisibility:hidden] npm install gitbook-plugin-local-video

{
"plugins": [ "local-video" ]
}

使用示例

为了使视频可以自适应，我们指定视频的width为100%，并设置宽高比为16:9，如下面所示

<video id="my-video" class="video-js" controls preload="auto" width="100%"
poster="https://www.mapull.com/logo/video.jpg" data-setup='{"aspectRatio":"16:9"}'>
    <source src="MY_VIDEO.mp4" type='video/mp4'>
    <source src="MY_VIDEO.webm" type='video/webm'>
  <p class="vjs-no-js">观看此视频需要启用 JavaScript，并且浏览器需要 
    <a href="http://videojs.com/html5-video-support/" target="_blank">支持 HTML5 视频播放</a>
  </p>
</video>

另外我们还要再配置下css，即在website.css中加入

.video-js {
    width:100%;
    height: 100%;
}