Vue and Mux

Video.vue

<template>
    <video 
        id="my-player" class="video-js vjs-16-9" controls preload="auto" width="100%">
    </video>
</template>

<script>
import videojs from '@mux/videojs-kit';
import '@mux/videojs-kit/dist/index.css';

export default {
  name: "Video",
  mounted() {
  this.$nextTick(function () {
    const player = videojs('my-player', {
    timelineHoverPreviews: false,
    plugins: {
        mux: {
        debug: false,
        data: {
            env_key: 'ENV_KEY_HERE',
            video_title: 'Example Title'
        }
        }
    }
    });

    player.src({
        src: "MY_SOURCE_VIDEO_PLAYBACK_ID",
        type: "video/mux",
    });
  })
}
};

</script>