vueframe a simple Vue 3 component library for embedding video players

vueframe-a-simple-vue-3-component-library-for-embedding-video-players

Just wanted to share a project I’ve been working on called vueframe, offering a simple way to embed players such a YouTube and Vimeo easily with a universal API.

Its also the first time I’ve built a component library with VueJS so I would love feedback on this project so i can improve it and make it better.

here’s the GitHub repo if your interested.

also a star would be Awesome 🙂

EDIT:

I’m also working on a documentation website

Installation 📦

# npm
npm install @vueframe/vueframe

Setup ⚙️

// main.ts / main.js
import { createApp } from 'vue'
import App from './App.vue'
import VueFrame from '@vueframe/vueframe'

createApp(App)
  .use(VueFrame)
  .mount('#app')

Usage 💻

App.vue

YouTube

 id="dQw4w9WgXcQ" />

Vimeo

 id="676247342" />

Dailymotion

This component currently does not support autoplay or muted

 id="x8i1ffw" />

Props 🎛️

Prop Type Default Description
id string Required Video ID from the platform
autoplay boolean false Auto-start playback
muted boolean false Initialize video muted
width `string number` "1024px"
height `string number` "576px"

Examples 🎯

With Props

 id="dQw4w9WgXcQ" autoplay muted width="800px" height="450px" />

License 📄

MIT © vueframe

Total
0
Shares
Leave a Reply

Your email address will not be published. Required fields are marked *

Previous Post
the-impact-of-electric-vehicles-on-automotive-manufacturing:-the-role-of-first-time-quality,-digital-twins,-and-dimensional-engineering

The Impact of Electric Vehicles on Automotive Manufacturing: The Role of First-Time Quality, Digital Twins, and Dimensional Engineering

Next Post
sme-education-foundation-awards-record-number-of-sustainability-awards-to-sme-prime-schools

SME Education Foundation Awards Record Number of Sustainability Awards to SME PRIME Schools

Related Posts