videojs / videojs-contrib-dash

Video.js plugin for supporting the MPEG-DASH playback through a video.js player
https://videojs.github.io/videojs-contrib-dash/
Apache License 2.0
293 stars 128 forks source link

Won't initialize in an ES6 module #207

Open FossPrime opened 7 years ago

FossPrime commented 7 years ago

I'm using Vue.js and trying to use this dash plugin, video.js alone works flawlessly in a vue.js component. But it wont pair with this plugin

<template>
  <div class="root card-static card-content">
    <h2>Video</h2>
    <div class="center">
        <video id="my-video" class="video-js" controls preload="auto" width="640" height="264">
        </video>
    </div>
  </div>
</template>

<script>
import videojs from 'video.js'
import 'dashjs'
import 'videojs-contrib-dash'

export default {
  name: 'Video',
  mounted () {
    console.log('videojs.Html5DashJS is ' + videojs.Html5DashJS)
  }
}
</script>

That outputs videojs.Html5DashJS is undefined. Yes "dashjs": "^2.5.0", "video.js": "^6.2.5", "videojs-contrib-dash": "^2.9.1" are in my package.json

gkatsev commented 7 years ago

How are you compiling/bundling your javascript? Webpack? If so, what version? Can you look at the webpack-visualizer or source-map-explorer and see if you have two versions of video.js? I wonder if it's related to https://github.com/videojs/video.js/issues/4580

FossPrime commented 7 years ago

isolated case, based on vue-cli webpack template: https://github.com/rayfoss/vuejs-videojs-dash-demo/blob/master/src/components/Hello.vue

tried 5.20, 6.0, 6.1 and 6.2 same issue.

also threw the dev webpack build stats.json in the root (warning: its 10.9mb) https://github.com/rayfoss/vuejs-videojs-dash-demo/blob/master/stats.json

gkatsev commented 7 years ago

Oh, I think the issue here might be a bit separate than videojs/video.js#4580. Seems like in this case video.js is included twice for some reason. Once with dashvue and ones with contrib-dash.