Can't prevent preloading

[Bocom]

I have created a basic Vue 3 component for video playback, but I can't seem to get preload="none" (or preload="metadata" for that matter) working.

Component code

<script setup lang="ts">
import videojs from '@mux/videojs-kit';
import '@mux/videojs-kit/dist/index.css';
import { onMounted, ref } from 'vue';

defineProps({
  videoId: String,
});

const playerEl = ref();

onMounted(() => {
  videojs(playerEl.value, {
    preload: 'none',
    controls: true,
  });
});
</script>

<template>
  <video ref="playerEl" class="video-js vjs-16-9">
    <source :src="videoId" type="video/mux" />
  </video>
</template>

I've tried setting it on the video element itself and as an option in the videojs call, but the video gets preloaded anyway. Am I doing something wrong?

I'm using version 0.11.3.

[gkatsev]

Unfortunately, hls.js, the default playback engine for videojs-mux-kit, doesn't respect that preload attribute/property by default.

The quick-fix is for you to try the VHS build of videojs-mux-kit. However, this does bring up something that we should support here.

[Bocom]

Ah, I see, good to know!

I actually did try the VHS build but it didn't work for me, couldn't get the video to actually load (essentially the same component code), but figured that was a separate issue.