Include vtt.js using require/browserify

[brandonocasey]

Description

Right now we concat vtt.js right into the video.js bundle.

Specific Changes proposed

• add code that wraps around the require for vtt.js so that it can be disabled
• use envify to enable or disable a build with vtt.js
• use unreachable-branch-transform to remove the require call
• use browserify-shim to wrap vtt.js if it is being included

Requirements Checklist

• Feature implemented / Bug fixed
• If necessary, more likely in a feature request than a bug fix
  • Change has been verified in an actual browser (Chome, Firefox, IE)
  • Unit Tests updated or fixed
  • Docs/guides updated
  • Example created (starter template on JSBin)
• Reviewed by Two Core Contributors

[brandonocasey]

this will be changed to true === false or false === false depending on envify configuration. From there unreachable-branch-transform will remove one of these if statements.

[misteroneill]

I dig it. Proper pre-processing! 👍

[misteroneill]

Does videojs-standard not complain about this trailing comma?

[brandonocasey]

hmmm I think that it should? maybe we ignore the whole build directory.

[misteroneill]

Yeah, it does. Oh well. I don't have a problem with hanging commas. 😆

[misteroneill]

I dig it. Proper pre-processing! 👍

[gkatsev]

I just realized that unfortunately, this doesn't solve all our needs :(
We need to be able to properly support webpack bundling as well as browserify.

[gkatsev]

Looks like both envify and unreachable-branch-transform can be run separately from browserify. We could run those on tech.js after running babel before publishing and that should make it so webpack can require it manually. I guess it'll have to be run manually after the alt and dist files are generated so that they don't step on each others toes.

[gkatsev]

Another option is to use something like https://github.com/erikdesjardins/babel-plugin-transform-dead-code-elimination, seems like it supports env vars by default and you can configure babel to run or not run plugins depending on env as well.

[gkatsev]

Looks like that package is going to be deprecated in favor of babili. It's possible we can use just parts of babili to do what we want. For example transform-inline-environment-variables or transform-node-env-inline with minify-dead-code-elimination or minify-guarded-expressions

[brandonocasey]

I think that we currently have no way to include vtt.js with webpack like your describing (as we concat it onto the browser dist). We default to not including videojs-vtt.js in the es5 dist. Do we want to require videojs-vtt.js it in the es5 dist by default?

[brandonocasey]

See #3919