2026-06-04 13:41:57 +00:00
|
|
|
|
# QZMusic Web
|
|
|
|
|
|
|
2026-06-04 14:23:39 +00:00
|
|
|
|
QZMusic 网页版,基于 Vue 3 + TypeScript + Vite 构建的音乐播放器,支持插件系统获取音乐资源。
|
2026-06-04 13:41:57 +00:00
|
|
|
|
|
|
|
|
|
|
## 功能特性
|
|
|
|
|
|
|
|
|
|
|
|
- 🎵 音乐播放控制(播放/暂停、上一首、下一首)
|
|
|
|
|
|
- 📜 播放列表管理
|
|
|
|
|
|
- 🎨 深色/浅色主题切换
|
|
|
|
|
|
- 🎚️ 音量控制
|
|
|
|
|
|
- 📊 音频可视化(基于 Web Audio API)
|
|
|
|
|
|
- 🔍 搜索功能
|
2026-06-04 14:23:39 +00:00
|
|
|
|
- 🔌 **插件系统** - 支持通过插件获取音乐资源
|
2026-06-13 17:11:28 +00:00
|
|
|
|
- 🌐 默认端口:1219
|
2026-06-04 13:57:25 +00:00
|
|
|
|
|
|
|
|
|
|
## 快速开始
|
|
|
|
|
|
|
2026-06-04 14:05:06 +00:00
|
|
|
|
### 一键安装(推荐)
|
|
|
|
|
|
|
|
|
|
|
|
直接从 Gitea 仓库一键安装部署:
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 方式1:使用 curl 直接执行
|
|
|
|
|
|
bash <(curl -sL http://171.80.3.149:4321/miao-moe/QZMusic-Web/raw/branch/master/install.sh)
|
|
|
|
|
|
|
|
|
|
|
|
# 方式2:克隆后执行
|
|
|
|
|
|
git clone http://171.80.3.149:4321/miao-moe/QZMusic-Web.git
|
|
|
|
|
|
cd QZMusic-Web
|
|
|
|
|
|
bash install.sh
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### 一键部署(本地开发)
|
2026-06-04 13:57:25 +00:00
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 使用一键部署脚本
|
|
|
|
|
|
npm run deploy
|
|
|
|
|
|
# 或者直接运行
|
|
|
|
|
|
./deploy.sh
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### 一键启动
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 使用启动脚本
|
|
|
|
|
|
npm run start
|
|
|
|
|
|
# 或者直接运行
|
|
|
|
|
|
./start.sh
|
|
|
|
|
|
```
|
2026-06-04 13:41:57 +00:00
|
|
|
|
|
2026-06-04 14:05:06 +00:00
|
|
|
|
## 一键卸载
|
|
|
|
|
|
|
|
|
|
|
|
完全删除所有 QZMusic 部署文件和配置:
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
# 方式1:使用 curl 直接执行
|
|
|
|
|
|
bash <(curl -sL http://171.80.3.149:4321/miao-moe/QZMusic-Web/raw/branch/master/uninstall.sh)
|
|
|
|
|
|
|
|
|
|
|
|
# 方式2:在安装目录执行
|
|
|
|
|
|
cd /opt/QZMusic-Web
|
|
|
|
|
|
bash uninstall.sh
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
卸载将删除:
|
|
|
|
|
|
- 安装目录(`/opt/QZMusic-Web`)
|
2026-06-13 17:11:28 +00:00
|
|
|
|
- 端口 1219 上的所有进程
|
2026-06-04 14:05:06 +00:00
|
|
|
|
- Systemd 服务(如有)
|
|
|
|
|
|
- npm 全局包(如有)
|
|
|
|
|
|
- 相关缓存文件
|
|
|
|
|
|
|
2026-06-04 13:41:57 +00:00
|
|
|
|
## 开发
|
|
|
|
|
|
|
|
|
|
|
|
### 安装依赖
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
npm install
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
### 启动开发服务器
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
npm run dev
|
|
|
|
|
|
```
|
|
|
|
|
|
|
2026-06-13 17:11:28 +00:00
|
|
|
|
服务器将在 http://localhost:1219 启动
|
2026-06-04 13:57:25 +00:00
|
|
|
|
|
2026-06-04 13:41:57 +00:00
|
|
|
|
### 构建生产版本
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
npm run build
|
|
|
|
|
|
```
|
|
|
|
|
|
|
2026-06-04 13:57:25 +00:00
|
|
|
|
### 预览生产构建
|
|
|
|
|
|
|
|
|
|
|
|
```bash
|
|
|
|
|
|
npm run preview
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 脚本说明
|
|
|
|
|
|
|
2026-06-04 14:05:06 +00:00
|
|
|
|
### 本地脚本
|
|
|
|
|
|
|
2026-06-04 13:57:25 +00:00
|
|
|
|
| 命令 | 说明 |
|
|
|
|
|
|
|------|------|
|
2026-06-13 17:11:28 +00:00
|
|
|
|
| `npm run dev` | 启动开发服务器(端口 1219) |
|
2026-06-04 13:57:25 +00:00
|
|
|
|
| `npm run build` | 构建生产版本 |
|
2026-06-13 17:11:28 +00:00
|
|
|
|
| `npm run preview` | 预览生产构建(端口 1219) |
|
2026-06-04 13:57:25 +00:00
|
|
|
|
| `npm run deploy` | 一键部署(安装依赖 + 构建) |
|
2026-06-04 14:05:06 +00:00
|
|
|
|
| `npm run start` | 一键启动(自动安装依赖 + 启动) |
|
|
|
|
|
|
| `npm run install-app` | 一键安装(从仓库安装到 /opt) |
|
|
|
|
|
|
| `npm run uninstall` | 一键卸载(删除所有部署文件) |
|
|
|
|
|
|
|
|
|
|
|
|
### 一键命令(远程执行)
|
|
|
|
|
|
|
|
|
|
|
|
| 命令 | 说明 |
|
|
|
|
|
|
|------|------|
|
|
|
|
|
|
| `bash <(curl ... install.sh)` | 从仓库一键安装部署 |
|
|
|
|
|
|
| `bash <(curl ... uninstall.sh)` | 从仓库一键卸载所有部署 |
|
2026-06-04 13:57:25 +00:00
|
|
|
|
|
2026-06-04 13:41:57 +00:00
|
|
|
|
## 项目结构
|
|
|
|
|
|
|
|
|
|
|
|
```
|
|
|
|
|
|
├── src/
|
|
|
|
|
|
│ ├── assets/ # 静态资源
|
|
|
|
|
|
│ ├── components/ # 组件
|
|
|
|
|
|
│ ├── layout/ # 布局组件
|
|
|
|
|
|
│ ├── stores/ # Pinia 状态管理
|
|
|
|
|
|
│ ├── styles/ # 样式文件
|
|
|
|
|
|
│ ├── types/ # TypeScript 类型定义
|
|
|
|
|
|
│ ├── utils/ # 工具函数
|
|
|
|
|
|
│ ├── views/ # 页面组件
|
|
|
|
|
|
│ ├── App.vue # 根组件
|
|
|
|
|
|
│ └── main.ts # 入口文件
|
|
|
|
|
|
├── public/ # 公开资源
|
|
|
|
|
|
├── index.html # HTML 模板
|
|
|
|
|
|
├── vite.config.ts # Vite 配置
|
|
|
|
|
|
└── tsconfig.json # TypeScript 配置
|
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
|
|
## 注意事项
|
|
|
|
|
|
|
|
|
|
|
|
- 网页版移除了原 Electron 项目的本地文件系统访问和原生插件功能
|
|
|
|
|
|
- 音乐播放使用 HTML5 Audio API
|
|
|
|
|
|
- 音频可视化使用 Web Audio API
|