ruby-on-rails - 如何在 Rails 6 站点中实现 plyr.js？

Question

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

Answer 1

Rails 6 使用 webpacker 管理他们的资产，安装plyr你只需要通过包管理器安装它：

yarn add plyr

然后你可以像文档一样在你的js文件中要求它：

import Plyr from 'plyr';
 
const player = new Plyr('#player');

确保你已经运行了 webpacker 开发服务器，否则你可能会找不到模块。希望对大家有所帮助，如有错误请指正。

Answer 2

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

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

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

步骤 2. 将 plyr.js 文件放入app/assets/javascripts文件夹

第 3 步。您需要在清单文件中提及 plyr.js，以便在您的应用程序中使用它。将以下行（不带扩展名）添加到清单文件 ( app/assets/javascripts/application.js)

//= require plyr

现在 Plyr js 可供您使用，并且可以照常使用。<video>您可以在 erb中创建标签来调出播放器。

例如。

<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>