如何在Rails6站点中实现plyr.js

Question

https://plyr.io/是一个javascript库，用于播放支持YouTube和Vimeo的视频。我正在尝试在Rails6站点中实现它。实现这一目标的步骤是什么？

Answer 1

Rails 6使用webpacker来管理其资产，要安装plyr，只需要通过包管理器安装即可：

yarn add plyr

然后你可以在你的js文件中要求它，比如文档：

import Plyr from 'plyr';

const player = new Plyr('#player');

确保您已经运行了webpackerdev-server，否则您可能会找不到模块。希望得到帮助，如果有任何错误，请纠正我。

Answer 2

有很多方法可以将plyr.js包含到您的项目中，然后使用它。

我正在介绍将plyr.js包含到您的项目中的方法之一：

步骤1。从其网站或cdn链接下载Plyr.jshttps://cdn.plyr.io/3.6.2/plyr.js

步骤2。将plyr.js文件放在app/assets/javascripts文件夹中

步骤3。你需要在清单文件中提到plyr.js，这样它才能在你的应用程序中使用。将以下行(不带扩展名(添加到清单文件(app/assets/javascripts/application.js(

//= require plyr

现在Plyr-js可供您使用，并且可以照常使用。你可以在你的erb中创建<video>标签来显示玩家。

例如。

<video id="player" playsinline controls data-poster="/path/to/poster.jpg">
<source src="/path/to/video.mp4" type="video/mp4" />
<source src="/path/to/video.webm" type="video/webm" />
</video>