Awesome Open Source
Awesome Open Source

larkplayer

 NPM version Downloads License

中文|English

简介

larkplayer 是一款轻量、可扩展的 html5 播放器。

核心在于插件化的机制,使得播放器可以像高达一样可拆卸和组装,从而舒适地支持业务从简单到复杂的演变。

功能支持

  • 支持 mp4、webm、ogg、m3u8 多种格式
  • 支持 PC、移动端自适应样式
  • 支持视频点播、直播
  • 支持断点续播功能
  • 支持360°全景视频

相关功能通过插件提供,请参考下文的插件章节

特性

  • 体积小巧,~12KB(gzip)
  • 解决大部分兼容性问题,如全屏、移动端内联播放等
  • 提供事件机制,支持自定义事件
  • 提供插件机制,支持多种插件类型
  • 原生 javascript 编写,无特定框架依赖

查看在线示例

下载

NPM

npm install larkplayer

CDN

<script src="https://unpkg.com/[email protected]/dist/larkplayer.js"></script>

快速上手

通过 script 的方式

<!DOCTYPE html>
<html>
<head>
    <title>larkplayer quick start</title>
</head>
<body>
    <video id="my-video" src="https://baikebcs.bdimg.com/baike-other/big-buck-bunny.mp4" width="400" height="300" controls>
        请升级浏览器以支持 html5 video
    </video>
 
    <script type="text/javascript" src="https://unpkg.com/[email protected]/dist/larkplayer.js"></script>
    <script type="text/javascript">
        // js 文件以 umd 的形式包装,以 script 的形式引用时,larkplayer 会直接挂载在 window 上
        var player = larkplayer('my-video', {
            width: 640,
            height: 360
        }, function () {
            console.log('player is ready');
        });

        player.on('firstplay', function () {
            console.log('firstplay');
        });

        // 支持所有的 html5 标准事件
        player.on('play', function () {
            console.log('play');
        });
        player.on('ended', function () {
            console.log('ended');
            player.src('http://www.w3school.com.cn/i/movie.ogg');
            player.play();
        });
    </script>
</body>
</html>

通过 npm + es6 的方式

import larkplayer from 'larkplayer';

const player = larkplayer('video-el');

文档

插件

如何贡献代码

  • fork 或 clone 代码到本地
  • 修改代码
  • 使用 fecs 检查 js 代码规范
    • 在项目根目录下执行 fecs src (更多选项可参考 fecs_eslint_wiki
    • 修复所有级别为 ERROR 的提示
    • 建议修复所有级别为 WARN 的提示
  • 执行测试
    • 切换到 test 目录,并执行 karma start
    • 修复未通过的 case
  • 提交 pull request

使用交流

QQ 群:860073225

Change Log

CHANGELOG

License

larkplayer is MIT licensed


Get A Weekly Email With Trending Projects For These Topics
No Spam. Unsubscribe easily at any time.
javascript (68,034
video (806
html5 (443
player (234
video-player (124
html5-video (26
videojs (22

Find Open Source By Browsing 7,000 Topics Across 59 Categories