如何在 Rails 6 个站点中实施 plyr.js？

Question

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

Answer 1

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

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

第一步。从其网站或从 cdn 下载 Plyr.js link https://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>

Answer 2

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

yarn add plyr

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

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

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

如何在 Rails 6 个站点中实施 plyr.js？

How to implement plyr.js within a Rails 6 site?

ruby-on-rails

ruby

webpacker

plyr.js