eplayer 
🎯 A web-components html5 video player facing future.
who use eplayer？
Use
- 导入进来 js 文件，可以从 lib 目录获取
目前 web-components 原生支持度是在太差，尤其是国内各种奇葩浏览器（搜狗、QQ等），需要引入 polyfill
<script src="https://unpkg.com/@webcomponents/webcomponentsjs@2.2.1/webcomponents-bundle.js"></script>
<script src="./eplayer.js"></script>- 插入
e-player标签，没错，只需要将平时用的video换成e-player即可
type 属性可选，默认为 mp4
<e-player src="./001.mp4"></e-player>- 可选设置css，用于穿透 shadow-dom 预留的默认样式
e-player {
/* 主题色 默认为哔哩哔哩同款蓝*/
--theme:#f13e7b;
/* 进度条底色 一般不用设置 */
--progress:rgba(255,255,255,.3);
/* 进度条偏移颜色 一般不用设置 */
--buffer:rgba(255,255,255,.3);
/* 图标颜色 一般不用设置 */
--icons:rgba(255,255,255,.6)
}hls & flv
原生支持 mp4 和 mkv ,如果需要支持 m3u8 和 flv，需要先引入 hls.js 和 flv.js
这两个文件太大，建议手动 gzip
<script src="./hlv.min.js"></script>
<script src="./flv.min.js"></script>然后，type 属性 对应 hls 或 flv
<e-player src="./001.m3u8" type="hls"></e-player>Vue
vue 默认是不支持 web-components 的，它无法主动判断含有-的是 vue 组件还是 web 组件
所以需要手动配置，忽略掉e-player
Vue.config.ignoredElements = [
'e-player'
]然后，同样需要引入上面的几个文件，然后 bind 一下 src 和 type
<e-player :src="url" :type="type"></e-player>可以封装成 vue 组件来使用：vue-web-components-wrapper
React
react 直接支持 web-components，直接在 render 函数中e-player标签
同样的，JSX 并不把它当作 vnode tree 的孩子，需要手动操作 dom
通常为了方便的使用 ref，会封装成 react 组件来使用：
function Eplayer() {
return <e-player src={this.state.src} type={this.state.type}></e-player>
}移动端
关于移动端，国产的手机浏览器太奇葩，没有好的兼容方法
目前会自动检测，移动端会自动替换为默认播放器，然后浏览器会自动替换 UI
