Vueプロジェクトでm3u8形式の動画を再生する方法

依存関係をインストールする

 npm install @easydarwin/easyplayer --save
 npm install copy-webpack-plugin@5.1.2 --save-dev

public/index.html を検索します。

node_modeols の @easydarwin で dist/compent/EasyPlayer-lib.min.js および EasyPlayer.wasm ファイルを見つけて、public ディレクトリにコピーします。

導入

	<script src="./EasyPlayer-lib.min.js"></script>

またどこで遊ぶか

1. はじめに

import EasyPlayer from "@easydarwin/easyplayer"

2. 登録する

コンポーネント内

components:{
    
    EasyPlayer}

3. コンポーネントを使用する

テンプレート内

<EasyPlayer :id="Math.floor(Math.random()*1+1)" :videoUrl=item :live="true" />

4.自分でスタイルを調整する

5. ダブルクリックして全画面表示します

結果