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

心如所願 發表於 2025-9-12 09:32:00

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

大家好，我是 <code>Java陈序员</code>。
你是否也曾遇到过这样的困扰：喜欢的音乐播放器要么颜值不够能打，界面好看的功能又太过简陋；在线听歌得忍受满屏广告和冗余功能，而且受版权限制，本地音乐管理又杂乱无章...
今天给大家推荐一款一款高颜值音乐播放器，听歌体验直接拉满!
<blockquote>
关注微信公众号：【Java陈序员】，获取开源项目分享、AI副业分享、超200本经典计算机电子书籍等。
</blockquote>
<h2 id="项目介绍">项目介绍</h2>
<code>SPlayer</code> —— 一个简约的音乐播放器，基于 Vue3 + TypeScript + Naïve UI + Electron 技术栈打造，兼顾了美观的界面和流畅的体验。
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823111232.png">
功能特色：
<ul>
<li>多平台适配：支持网页端和 Windows 桌面客户端，移动端也做了基础适配</li>
<li>沉浸式听歌体验：支持桌面歌词，封面主题色自适应；全站色调随歌曲封面变化，视觉感拉满；支持 Light/Dark/Auto 模式自动切换，白天黑夜都舒适</li>
<li>本地+在线双模式：支持本地歌曲管理及分类，并提供每日推荐、私人 FM、歌单收藏，发现更多好音乐等，同时支持播放部分无版权歌曲</li>
<li>其他细节功能：音乐频谱动态显示，跟着节奏律动；歌曲渐入渐出效果，切换更自然；支持云盘音乐管理，上传、播放、纠正一键操作；支持 MV 与视频播放、评论区互动</li>
</ul>
<h2 id="快速上手">快速上手</h2>
<h3 id="桌面端">桌面端</h3>
<code>SPlayer</code> 提供了 Windows 版本的安装包，可直接下载进行安装。
1、打开下载地址
<pre><code class="language-bash">https://github.com/imsyy/SPlayer/releases
</code></pre>
2、下载安装包
3、双击运行安装包，一键安装
<h3 id="web-端">Web 端</h3>
<code>SPlayer</code> 支持 Docker 部署，可使用 Docker 快速部署 Web 端。
1、拉取镜像
<pre><code class="language-bash"># 从 Docker Hub 拉取
docker pull ghcr.io/imsyy/splayer:latest

# 或者从 GitHub ghcr 拉取
docker pull ghcr.io/imsyy/splayer:latest
</code></pre>
2、运行容器
<pre><code class="language-bash">docker run -d --name SPlayer -p 25884:25884 imsyy/splayer:latest
</code></pre>
3、浏览器访问
<pre><code class="language-bash">http://{ip/域名}:25884
</code></pre>
<h2 id="功能体验">功能体验</h2>
<ul>
<li>明亮主题</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823112607.png">
<ul>
<li>深色主题</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823112701.png">
<ul>
<li>发现音乐</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823112725.png">
<ul>
<li>播客电台</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823112756.png">
<ul>
<li>最近播放</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823112957.png">
<ul>
<li>歌曲播放</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823113036.png">
<ul>
<li>热门评论</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823113125.png">
<ul>
<li>歌词设置</li>
</ul>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/SPlayer/img-20250823113205.png">
<h2 id="本地开发">本地开发</h2>
<code>SPlayer</code> 开发依赖 Node.js, 需提前安装好最新稳定版本的 Node.js 环境。
1、克隆或下载源码
<pre><code class="language-bash">git clone https://github.com/imsyy/SPlayer.git
</code></pre>
2、进入项目目录并安装依赖
<pre><code class="language-bash">cd SPlayer

pnpm install

# 推荐使用 pnpm, 如未安装可使用如下命令安装
npm install -g pnpm
</code></pre>
3、复制 <code>/.env.example</code> 文件并重命名为 <code>/.env</code> 并修改配置
4、运行启动
<pre><code class="language-bash">pnpm run dev
</code></pre>
5、可根据操作系统类型进行打包部署，打包成功后，会输出安装包或可执行文件在 <code>/dist</code> 目录中
<pre><code class="language-bash">## Windows
pnpm build:win

## Linux
pnpm build:linux

## MacOS
pnpm build:mac

## Web
pnpm build:web
</code></pre>
如果你是音乐爱好者，追求高颜值和实用功能，<code>SPlayer</code> 绝对值得一试！赶快去体验吧~
<pre><code class="language-bash">项目地址：https://github.com/imsyy/SPlayer
</code></pre>
<h2 id="最后">最后</h2>
推荐的开源项目已经收录到 <code>GitHub</code> 项目，欢迎 <code>Star</code>：
<pre><code>https://github.com/chenyl8848/great-open-source-project
</code></pre>
或者访问网站，进行在线浏览：
<pre><code>https://chencoding.top:8090/#/
</code></pre>
<img src="https://create-center.oss-cn-shenzhen.aliyuncs.com/github/img-20250608222400.png">
我创建了一个开源项目交流群，方便大家在群里交流、讨论开源项目。
但是任何人在群里打任何广告，都会被 T 掉。
如果你对这个交流群感兴趣或者在使用开源项目中遇到问题，可以通过如下方式进群：
关注微信公众号：【Java陈序员】，回复【开源项目交流群】进群，或者通过公众号下方的菜单添加个人微信，并备注【开源项目交流群】，通过后拉你进群。
<blockquote>
大家的点赞、收藏和评论都是对作者的支持，如文章对你有帮助还请点赞转发支持下，谢谢！
</blockquote>
<hr> 
来源：https://www.cnblogs.com/codechen8848/p/19077126

頁: [1]

琼殿技术论坛's Archiver

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