# @voorhoede/vue-dato-video
Fully optimized video component for videos from Dato CMS.
# Features
- Supports both Vimeo and YouTube.
- Has a fixed ratio, so space is reserved before the video is loaded. This prevents annoying layout jumps.
- Supports an optional video caption.
- Has a cover image that lazy loads, meaning the image will only be downloaded when necessary, resulting in much faster page loads.
- Supports autoplay.
# Installation
npm install @voorhoede/vue-dato-video
# Usage
# Bundler (Webpack, Rollup)
import Vue from 'vue'
import VueDatoVideo from '@voorhoede/vue-dato-video'
Vue.use(VueDatoVideo)
The CSS file should be imported seperately in the way you desire. It's located at @voorhoede/vue-dato-video/dist/vue-dato-video.css
.
# Browser
<!-- Include after Vue -->
<!-- Local files -->
<script src="@voorhoede/vue-dato-video/dist/vue-dato-video.js"></script>
<!-- From CDN -->
<script src="https://unpkg.com/@voorhoede/vue-dato-video"></script>
# Examples
# Youtube
# Vimeo
# API
# vue-dato-video
# props
video
Object (required)autoplay
Boolean (required)loop
Boolean (required)mute
Boolean (required)