Ai-3D音乐播放器-Mineradio -VibeCoding大赏-新增歌词字体自定义上传功能(个人学习)

效果:

官方作者介绍

Mineradio 是一款 Windows 桌面沉浸式音乐播放器,把天气电台、搜索播放、歌词舞台、粒子视觉和 3D 歌单架组合成一个更接近现场感的私人音乐空间。

简直踩在我审美上了!!!

自定义后的效果如下(个人根据最新版本新增了歌词字体自定义功能)

使用opencode+Sense nova-6.7 flash-lit完成

下载

国内加速源码下载:https://llzai.lanzoum.com/iorZg3ukurzg

官方地址访问:GitHub - XxHuberrr/Mineradio: 一款以电影镜头、粒子视觉和歌词舞台为核心的沉浸式音乐播放器。 · GitHub

立即下载 Windows 安装包

国内 GitHub 小白用户:优先使用蓝奏云下载,打开链接后直接下载 Mineradio-1.1.1-Setup.exe,速度通常比 GitHub Release 更稳、更接近满速。

下载入口 推荐人群 链接
蓝奏云满速下载 国内用户优先 下载 Mineradio 1.1.1 安装包
GitHub Release 备用 能稳定访问 GitHub 的用户 v1.1.1 Release

安装时只需要下载并运行 Mineradio-1.1.1-Setup.exe。不要下载 Source code.blockmaplatest.yml,也不要把 win-unpacked 当成正式安装包。

下载或安装被拦截怎么办

小众 Electron 桌面软件、未签名安装包有时会被浏览器、Windows Defender 或 SmartScreen 提示风险。请先确认安装包来自上面的蓝奏云或 GitHub Release 官方入口,文件名是 Mineradio-1.1.1-Setup.exe

  1. 浏览器下载栏提示风险时,打开下载列表,点这条下载右侧的 ... 三个点,选择 保留 / 仍要保留 / 显示更多 后继续保留。

  2. Windows SmartScreen 弹出蓝色拦截窗口时,点 更多信息,再点 仍要运行

  3. 如果杀毒软件明确显示木马、高危或已经隔离,不要强行运行;删除该文件后重新从蓝奏云或 GitHub Release 下载,仍然异常请带截图反馈给作者。

源码启动:

解压源码后,进到项目目录,查阅Reademe文档,开发步骤

确保电脑安装了nodejs,node版本可选>=24即可

可能出现下载依赖的问题,一般可以根据配置国内镜像源来解决,如果你不懂,没关系,复制报错的内容发给ai即可,按照步骤来一步步修正

下面说一个比较重要的,就是npm start报错的问题

bash 复制代码
D:\code\Mineradio-main>npm start
npm verbose cli D:\Program Files (x86)\nodejs\node.exe D:\Program Files (x86)\nodejs\node_modules\npm\bin\npm-cli.js
npm info using npm@11.13.0
npm info using node@v24.16.0
npm verbose title npm start
npm verbose argv "start"
npm verbose logfile logs-max:10 dir:C:\Users\suifeng\AppData\Local\npm-cache\_logs\2026-07-05T10_58_28_280Z-
npm verbose logfile C:\Users\suifeng\AppData\Local\npm-cache\_logs\2026-07-05T10_58_28_280Z-debug-0.log

> mineradio@1.1.1 start
> electron .

Downloading Electron binary...
TypeError: fetch failed
D:\code\Mineradio-main\node_modules\electron\index.js:43
      throw new Error(
      ^

Error: Electron failed to install correctly. Please delete `node_modules/electron` and run "npx install-electron --no" manually.
    at getElectronPath (D:\code\Mineradio-main\node_modules\electron\index.js:43:13)
    at Object.<anonymous> (D:\code\Mineradio-main\node_modules\electron\index.js:52:18)
    at Module._compile (node:internal/modules/cjs/loader:1854:14)
    at Object..js (node:internal/modules/cjs/loader:1985:10)
    at Module.load (node:internal/modules/cjs/loader:1577:32)
    at Module._load (node:internal/modules/cjs/loader:1379:12)
    at wrapModuleLoad (node:internal/modules/cjs/loader:255:19)
    at Module.require (node:internal/modules/cjs/loader:1600:12)
    at require (node:internal/modules/helpers:153:16)
    at Object.<anonymous> (D:\code\Mineradio-main\node_modules\electron\cli.js:5:18)

Node.js v24.16.0
npm verbose cwd D:\code\Mineradio-main
npm verbose os Windows_NT 10.0.19045
npm verbose node v24.16.0
npm verbose npm  v11.13.0
npm verbose exit 1
npm verbose code 1

最终有效的命令序列

1. 设置 Electron 下载镜像(环境变量)

bash 复制代码
set ELECTRON_MIRROR=https://npmmirror.com/mirrors/electron/

2. 安装依赖(跳过审计检查)

bash 复制代码
npm install --no-audit

3. 启动项目

bash 复制代码
npm start

技术要点总结

问题类型 原因 解决方式
网络访问 GitHub 下载缓慢 使用国内镜像源
npm 配置 新版语法变更 使用环境变量替代 config set
审计功能 镜像源未实现 API 使用 --no-audit 跳过
终端乱码 编码不匹配 执行 chcp 65001

最终运行结果

复制代码
> mineradio@1.1.1 start
> electron .
​
======================================================
 粒子音乐可视化 v2   → http://localhost:3000
 登录态: 已登录 cookie已加载
======================================================

✅ Electron 应用成功启动

✅ 服务运行在 http://localhost:3000

✅ 登录状态正常


相关命令速查

bash 复制代码
# 设置镜像(CMD)
set ELECTRON_MIRROR=https://npmmirror.com/mirrors/electron/
​
# 设置镜像(PowerShell)
$env:ELECTRON_MIRROR="https://npmmirror.com/mirrors/electron/"
​
# 安装依赖(跳过审计)
npm install --no-audit
​
# 清理缓存
npm cache clean --force
​
# 删除并重装 node_modules
rmdir /s /q node_modules
npm install --no-audit
​
# 修复终端乱码
chcp 65001
​
# 全局搜索样式文件
findstr /s /i "stone-song" *.css *.scss *.vue

opencode使用步骤:

不赘述了,只需两条对话

bash 复制代码
我需要新增功能,关于public里面的index.html的歌曲字体,可以新增上传自定义字体的按钮,实现自定义字体,下面开始完善


经过测试已经可以了,但是发现一个问题是上传的歌词字体文件有大小限制,不应该有限制才对,需修复
相关推荐
小+不通文墨5 分钟前
--no-multibyte-chars 解决OLED_data.c移植后中文乱码问题
c语言·经验分享·笔记·学习
知识分享小能手30 分钟前
统计学学习教程,从入门到精通,一元线性回归 —— 知识点详解(17)
学习·算法·线性回归
青山是哪个青山1 小时前
LangChain 1.x 学习笔记(一):为什么需要 LangChain?一文彻底理解 LangChain 生态
笔记·学习·langchain
cooldream20091 小时前
AI 时代,前端工程师的“新学习路线“—— 从“学框架“到“用 AI“
前端·人工智能·学习
CappuccinoRose1 小时前
Rust学习文档(二)
开发语言·后端·学习·rust
冻感糕人~2 小时前
大模型学习指南:收藏这份AI Agent四层工程地图(小白程序员必备)
java·大数据·人工智能·学习·大模型·agent·大模型学习
曲三酒馆2 小时前
“强比命打,钱娃D写”——这8个字就是我人生的全部了![特殊字符]
学习·生活·娱乐
统计学小王子2 小时前
《数学少年-确定与不确定》(第四章:“骰子不骗人“)
学习·初中数学科普
其实防守也摸鱼2 小时前
前端应用的离线暂停更新策略:构建稳定可靠的渐进式部署方案
服务器·前端·数据库·学习·ai·命令行·linux系统
MartinYeung53 小时前
[论文学习]Mamba:具有选择性状态空间的线性时间序列建模
学习