Nuxt / Vue project using Brightcove Video Player has no sound in ie11

Question

I'm using NUXT / Vue along with brightcove video player which has worked for me in the past with very few issues. I noticed today that my videos are playing but have NO SOUND in ie11. The videos work fine in every other browser I tested excpet ie11.

I do not see any errors in ie11 but there is a few warnings that I am not familiar with that I'm hoping have something to do with the no sound and can give me some direction for a solution:

VIDEOJS: WARN: Invalid playlist STREAM-INF detected. Missing BANDWITH attribute
VIDEOJS: WARN: player.dash() is deprecated. Use player.tech().vhs instead
VIDEOJS: WARN: player.hls is deprecated. Use player.tech().vhs instead
VIDEOJS: WARN: player.vhs is deprecated. Use player.tech().vhs instead

<template>
  <div id="video-component">
    <div class="container--content__full-width-mobile">
      <div class="video-headline font--primary font--bold">
        <slot name="videoHeadline"></slot>
      </div>
      <div
        class="container--video-player"
        :class="{ 'container--video-player__inline': videoInline }"
      >
        <div ref="playerElement" :id="playerId" class="video-player"></div>
        <div v-if="hasTranscript" class="transcript-accordion bg--primary">
          <div
            class="accordion"
            :key="accordion"
            v-for="(row, accordion) in accordionRows"
          >
            <div
              class="accordion-title"
              v-on:click="
                row.open = !row.open;
                rotateIcon = !rotateIcon;
              "
            >
              <div class="l-accordion-title">
                <p>Reveal Video Transcript</p>
                <i
                  class="fas fa-chevron-down transition-fast"
                  :class="{ rotateIcon }"
                  aria-hidden="true"
                ></i>
              </div>
              <!-- /.l-accordion-title -->
            </div>
            <div class="accordion-content" v-if="row.open">
              <slot name="videoTranscript"></slot>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import video from "~/mixins/video/videos.js";
export default {
  name: "VideoPlaylist",
  mixins: [video],
  props: {
    videoInline: {
      type: Boolean,
      required: false,
      default: false
    },
    videoId: {
      type: String,
      required: true
    },
    hasTranscript: {
      type: Boolean,
      required: false
    },
    autoPlay: {
      type: Boolean,
      required: false,
      default: true
    }
  },
  data() {
    return {
      accordionRows: {
        videoTranscript: {
          open: false
        }
      },
      rotateIcon: false
    };
  },
  computed: {
    playerId() {
      return `videoPlayer_${this._uid}`;
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.$brightcovePlayerLoader({
        refNode: `#${this.playerId}`,
        accountId: "2272822669001",
        playerId: "DMcAHJ5QL",
        embedId: "default",
        videoId: this.videoId,
        options: {
          aspectRatio: "16:9",
          autoplay: this.autoPlay
        }
      }).then(data => {
        console.log(`[VideoPlayer.vue] init player.then data:`);
        console.log(data);
      });
    });

    this.stopVideo();
  }
};
</script>