Vue js, импорт плагинов для videojs
В документации videojs плагины подключаются следующим образом
<script src="../node_modules/video.js/dist/video.min.js"></script>
<script src="../dist/Youtube.min.js"></script>
Как я подключаю в vuejs:
<template>
<div>
<video ref="videoPlayer" class="video-js"></video>
</div>
</template>
<script>
import 'video.js/dist/video-js.css';
import videojs from 'video.js';
//import {httpStreaming} from '@videojs/http-streaming'
import youtube from 'videojs-youtube'
export default {
name: "VideoPlayer",
data() {
return {
player: null,
options: {
'youtube': {
source: {
type: "video/youtube",
src: 'https://www.youtube.com/watch?v=xnLV6iwr3sQ'
},
techOrder: ["youtube"],
autoplay: false,
controls: true,
ytControls: true
}
}
}
},
mounted() {
this.player = videojs(this.$refs.videoPlayer, this.options, function onPlayerReady() {
console.log('onPlayerReady', this);
});
},
beforeDestroy() {
if (this.player) {
this.player.dispose()
}
}
}
</script>
Как правильно подключать плагины?
Ответы (1 шт):
Автор решения: Александр Рейдзан
→ Ссылка
Этого вполне достаточно:
data() {
return {
player: null,
configs: {}
}
},
beforeMount() {
this.configs.youtube = require('videojs-youtube');
},