Skip to content

▶️ 🎹 🎵 HTML5 <audio> tag sound player UI for Vue.js - supports single, loop, pause/stop modes etc

Notifications You must be signed in to change notification settings

shershen08/vuejs-sound-player

Folders and files

NameName
Last commit message
Last commit date
Nov 24, 2017
Mar 19, 2020
Dec 17, 2017
Nov 27, 2017
Feb 20, 2017
Nov 27, 2017
Jan 15, 2019
Dec 18, 2017
Nov 25, 2017
Nov 28, 2017
May 12, 2019
Nov 24, 2017
Nov 27, 2017
Dec 11, 2020

Repository files navigation

Vue.js sound player

Vue.js sound audio player UI. Covers audio-tag API and adds more.

dependencies status

Demo

See DEMO here

Installation

Use npm: npm install vue-audio --save

Or bower: bower install vue-audio

Usage

Add in the component import VueAudio from 'vue-audio';

Use in the template <vue-audio file="myLocalFile"></vue-audio>

The component has following attributes:

  • file (String), required;
  • autoPlay (Boolean), optional, false by default;
  • loop (Boolean), optional, false by default;

For styling the Bootstrap classes v 3.7 are used, so you may want to add bootstrap css package or add via stylesheet link <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css">

Questions, bugs

Create an issue or try to ping me on twitter @legkoletat

Contribute

1. install dependencies

yarn install

2. run the dev server

yarn dev

and then access the url which the project is running at(example: http://localhost:8081/) . Otherwise, you can simplify run this command.

yarn open

It will open the website after building.

License

MIT