听歌体验直接拉满!推荐一款高颜值音乐播放器!

大家好,我是 Java陈序员

你是否也曾遇到过这样的困扰:喜欢的音乐播放器要么颜值不够能打,界面好看的功能又太过简陋;在线听歌得忍受满屏广告和冗余功能,而且受版权限制,本地音乐管理又杂乱无章...

今天给大家推荐一款一款高颜值音乐播放器,听歌体验直接拉满!

项目介绍

SPlayer ------ 一个简约的音乐播放器,基于 Vue3 + TypeScript + Naïve UI + Electron 技术栈打造,兼顾了美观的界面和流畅的体验。

功能特色

  • 多平台适配:支持网页端和 Windows 桌面客户端,移动端也做了基础适配
  • 沉浸式听歌体验:支持桌面歌词,封面主题色自适应;全站色调随歌曲封面变化,视觉感拉满;支持 Light/Dark/Auto 模式自动切换,白天黑夜都舒适
  • 本地+在线双模式:支持本地歌曲管理及分类,并提供每日推荐、私人 FM、歌单收藏,发现更多好音乐等,同时支持播放部分无版权歌曲
  • 其他细节功能:音乐频谱动态显示,跟着节奏律动;歌曲渐入渐出效果,切换更自然;支持云盘音乐管理,上传、播放、纠正一键操作;支持 MV 与视频播放、评论区互动

快速上手

桌面端

SPlayer 提供了 Windows 版本的安装包,可直接下载进行安装。

1、打开下载地址

bash 复制代码
https://github.com/imsyy/SPlayer/releases

2、下载安装包

3、双击运行安装包,一键安装

Web 端

SPlayer 支持 Docker 部署,可使用 Docker 快速部署 Web 端。

1、拉取镜像

bash 复制代码
# 从 Docker Hub 拉取
docker pull ghcr.io/imsyy/splayer:latest

# 或者从 GitHub ghcr 拉取
docker pull ghcr.io/imsyy/splayer:latest

2、运行容器

bash 复制代码
docker run -d --name SPlayer -p 25884:25884 imsyy/splayer:latest

3、浏览器访问

bash 复制代码
http://{ip/域名}:25884

功能体验

  • 明亮主题
  • 深色主题
  • 发现音乐
  • 播客电台
  • 最近播放
  • 歌曲播放
  • 热门评论
  • 歌词设置

本地开发

SPlayer 开发依赖 Node.js, 需提前安装好最新稳定版本的 Node.js 环境。

1、克隆或下载源码

bash 复制代码
git clone https://github.com/imsyy/SPlayer.git

2、进入项目目录并安装依赖

bash 复制代码
cd SPlayer

pnpm install

# 推荐使用 pnpm, 如未安装可使用如下命令安装
npm install -g pnpm

3、复制 /.env.example 文件并重命名为 /.env 并修改配置

4、运行启动

bash 复制代码
pnpm run dev

5、可根据操作系统类型进行打包部署,打包成功后,会输出安装包或可执行文件在 /dist 目录中

bash 复制代码
## Windows
pnpm build:win

## Linux
pnpm build:linux

## MacOS
pnpm build:mac	

## Web
pnpm build:web	

如果你是音乐爱好者,追求高颜值和实用功能,SPlayer 绝对值得一试!赶快去体验吧~

bash 复制代码
项目地址:https://github.com/imsyy/SPlayer

最后

推荐的开源项目已经收录到 GitHub 项目,欢迎 Star

bash 复制代码
https://github.com/chenyl8848/great-open-source-project

或者访问网站,进行在线浏览:

bash 复制代码
https://chencoding.top:8090/#/

大家的点赞、收藏和评论都是对作者的支持,如文章对你有帮助还请点赞转发支持下,谢谢!


相关推荐
大橙子额1 小时前
【解决报错】Cannot assign to read only property ‘exports‘ of object ‘#<Object>‘
前端·javascript·vue.js
LYFlied2 小时前
从 Vue 到 React,再到 React Native:资深前端开发者的平滑过渡指南
vue.js·react native·react.js
人鱼传说2 小时前
docker desktop是一个好东西
运维·docker·容器
B站_计算机毕业设计之家3 小时前
豆瓣电影数据采集分析推荐系统 | Python Vue Flask框架 LSTM Echarts多技术融合开发 毕业设计源码 计算机
vue.js·python·机器学习·flask·echarts·lstm·推荐算法
忆~遂愿3 小时前
CANN metadef 核心解析:计算图原型定义、算子元数据抽象与异构系统互操作机制
docker·容器
xjt_09014 小时前
基于 Vue 3 构建企业级 Web Components 组件库
前端·javascript·vue.js
我是伪码农4 小时前
Vue 2.3
前端·javascript·vue.js
说实话起个名字真难啊4 小时前
用docker来安装openclaw
docker·ai·容器
恬静的小魔龙5 小时前
【群晖Nas】群晖Nas中实现SVN Server功能、Docker/ContainerManager等
docker·svn·容器
跳动的梦想家h5 小时前
环境配置 + AI 提效双管齐下
java·vue.js·spring