vue-twitch-video-controlls
Package vue-twitch-video-controls
the objective of this package is to embed video twitch with use all controls in Vue js
GitHub
Link of the package at GitHub : https://github.com/redaEnnakouri/vue-twitch-video-controls
Install package
install package with commande npm i vue-twitch-video-controlls
Import Component
<template>
<vue-twitch-video-controlles />
</template>
<script>
import VueTwitchVideoControlles from "@/vue-twitch-video-controlles.vue";
export defiault {
components: {
VueTwitchVideoControlles,
}
};
</script>
Video Control
For control video you need to send props to component like :
- video :String (you need to import id video at twitch)
- width :String
- height :String
- mute :Boolean
- autoplay :Boolean
- controls :Boolean (show controls video)
- allowfullscreen :Boolean
For Exemple :
<template>
<vue-twitch-video-controlles
:video="1148356867"
:controls="true"
:mute="false"
/>
</template>
<script>
import VueTwitchVideoControlles from "@/vue-twitch-video-controlles.vue";
export defiault {
components: {
VueTwitchVideoControlles,
}
};
</script>
Buttons Controls
for hide buttons Controls you can send props :allowButtons =false
<template>
<vue-twitch-video-controlles
:video="1148356867"
:allowButtons =false
/>
</template>
<script>
import VueTwitchVideoControlles from "@/vue-twitch-video-controlles.vue";
export defiault {
components: {
VueTwitchVideoControlles,
}
};
</script>
Dependencies
@babel/core: ^7.14.6@babel/preset-env: ^7.14.7@rollup/plugin-alias: ^3.1.2@rollup/plugin-babel: ^5.3.0@rollup/plugin-commonjs: ^14.0.0@rollup/plugin-node-resolve: ^9.0.0@rollup/plugin-replace: ^2.4.2@vue/cli-plugin-babel: ^4.5.13@vue/cli-service: ^4.5.13@vue/compiler-sfc: ^3.0.11cross-env: ^7.0.3minimist: ^1.2.5postcss: ^8.2.10rimraf: ^3.0.2rollup: ^2.52.8rollup-plugin-postcss: ^4.0.0rollup-plugin-terser: ^7.0.2rollup-plugin-vue: ^6.0.0vue: ^3.0.5