Skip to content

Music Player ​

Firefly includes a built-in music player supporting Meting API (online platforms) and local music.

Config File ​

src/config/musicConfig.ts

Basic Configuration ​

PropertyTypeDefaultDescription
showInNavbarbooleantrueShow music player entry in navbar
showInSidebarbooleantrueShow music player component in the sidebar
modestring"meting"Mode: "meting" online, "local" local files
volumenumber0.7Default volume (0-1)
playModestring"list"Play mode: "list" loop, "one" repeat, "random" shuffle
showLyricsbooleantrueShow lyrics

TIP

The music player has two display locations:

  1. Sidebar: Disable by setting showInSidebar to false
  2. Navbar: Disable by setting showInNavbar to false

Meting API Mode ​

PropertyTypeDefaultDescription
meting.apistringOfficial APIMeting API URL
meting.serverstring"netease"Platform: "netease" "tencent" "kugou" "xiami" "baidu"
meting.typestring"playlist"Type: "song" "playlist" "album" "search" "artist"
meting.idstring-Playlist/album/song ID or search keyword
meting.authstring""Auth token (optional)
meting.fallbackApisstring[]-Fallback API list
ts
meting: {
  server: "netease",
  type: "playlist",
  id: "10046455237",
  fallbackApis: [
    "https://api.injahow.cn/meting/?server=:server&type=:type&id=:id",
  ],
},

Local Music Mode ​

When mode is "local", use local music configuration.

Playlist Item Properties ​

PropertyTypeRequiredDescription
namestringYesSong name
artiststringYesArtist
urlstringYesMusic file path (relative to public directory)
coverstringNoCover image path
lrcstringNoLyrics (LRC file path or inline lyrics string)
ts
local: {
  playlist: [
    {
      name: "Song Title",
      artist: "Artist Name",
      url: "/assets/music/song.mp3",
      cover: "/assets/music/cover/cover.webp",
      lrc: "/assets/music/lrc/song.lrc",
    },
  ],
},