https://github.com/jacoblincool/svelte-audio
Audio Player Component for Svelte.
https://github.com/jacoblincool/svelte-audio
audio-player svelte
Last synced: 8 months ago
JSON representation
Audio Player Component for Svelte.
- Host: GitHub
- URL: https://github.com/jacoblincool/svelte-audio
- Owner: JacobLinCool
- License: mit
- Created: 2024-04-02T06:56:42.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-04-04T15:44:23.000Z (about 2 years ago)
- Last Synced: 2025-10-22T05:21:00.278Z (8 months ago)
- Topics: audio-player, svelte
- Language: TypeScript
- Homepage: http://jacoblin.cool/svelte-audio/
- Size: 240 KB
- Stars: 2
- Watchers: 1
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# Svelte Audio
Audio Player Component for Svelte.
> It uses [APlayer](https://github.com/DIYgod/APlayer) under the hood!
## Installation
```bash
pnpm i -D svelte-audio
```
## Usage
```html
import { Audio } from "svelte-audio";
import { playlist } from "./playlist";
let paused = false;
let time = 0;
let volume = 1;
let mini = false;
Loading ...
Paused: Volume:
Mini:
Current Time: {time}s
```
playlist.ts
```ts
import type { Playlist } from "svelte-audio";
export const playlist: Playlist = [
{
name: "ChatGPT Help Me!",
artist: "Jacob, GPT-4, Suno v3",
cover: "https://cdn1.suno.ai/image_6aee2edf-ba1e-4394-b75e-7385261c4e07.png",
url: "https://cdn1.suno.ai/ebb95c9f-ef34-4cd1-b0f1-d8a97666550a.mp3",
lrc: "https://storage.jacoblin.cool/ChatGPT-Help-Me.lrc",
},
{
name: "Flavors of the Night: Taipei",
artist: "Jacob, GPT-4, Suno v3",
cover: "https://cdn1.suno.ai/image_3400c31e-d6ec-4101-80b1-1ae11dd3d220.png",
url: "https://cdn1.suno.ai/3400c31e-d6ec-4101-80b1-1ae11dd3d220.mp3",
},
];
```
To see the full list of props, check out the [Storybook](https://jacoblincool.github.io/svelte-audio).
### Access to APlayer Instance
You can access the APlayer instance by using the `.player()` method.
```html
import { Audio } from "svelte-audio";
import { playlist } from "./playlist";
let audio: Audio;
function remove() {
audio.player().list.clear();
}
Loading ...
Remove Songs
```
See all the API methods in the [APlayer Documentation](https://aplayer.js.org/#/home?id=api).