A video player wrapped as a Vue.js component


stars 🌟issues ⚠️updated 🛠created 🐣size 🏋️‍♀️
Minified + gzip package size for @thiago.dlm/vue-video in KB



A video player wrapped as a Vue.js component

How to use it on your project

First of all, download it from NPM

npm install -s @thiago.dlm/vue-video

vue-video dependencies

vue-video has vue-fontawesome as its dependency. Therefore it will be installed with this package. In order to use this component you will need to instanciate vue-fontawesome first.

On your main.js file


import { library } from '@fortawesome/fontawesome-svg-core';
import { faPlay, faPause, faExpand } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome';
import App from './App';

library.add(faPlay, faPause, faExpand);

Vue.component('font-awesome-icon', FontAwesomeIcon);

Importing into your component's code


    <v_video :src="URL_TO_YOUR_VIDEO"/>
  import v_video from '@thiago.dlm/vue-video';

  export default {
    name: 'Portfolio',
    components: {

If you want to run the code from GitHub

This is pretty much the same for when you create a project using vue-cli

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build

# build for production and view the bundle analyzer report
npm run build --report

# run unit tests
npm run unit

# run all tests
npm test

For a detailed explanation on how things work, check out the guide and docs for vue-loader.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.