Vue3.0引用Dplayer播放器播放m3u8

 安装引入 Dplayer组件

npm install -s Dplayer 

-or 

yarn add Dplayer

引入Hls模块支持M3u8格式视频

npm install hls.js -s

 以下直接提上vue3.0的代码，具体自己看吧

<template>
  <div class="p-4">
    <div id="dplayer"></div>
  </div>
</template>
<script lang="ts">
  import { defineComponent, onMounted } from 'vue';
  import Hls from 'hls.js';
  import DPlayer from 'dplayer';

  export default defineComponent({
    setup() {
      let dp: any;

      // 初始化播放器
      const initPlayer = () => {
        dp = new DPlayer({
          container: document.getElementById('dplayer'),
          autoplay: false,
          theme: '#0093ff',
          loop: true,
          lang: 'zh-cn',
          screenshot: true,
          hotkey: true,
          preload: 'auto',
          volume: 0.7,
          mutex: true,
          logo: 'https://i.lol