# electron_practice

**Repository Path**: luckylanyu/electron_practice

## Basic Information

- **Project Name**: electron_practice
- **Description**: 客户端 ：electron+vue3+vite+sass

后端：Node

桌面版网易云音乐


- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-10-01
- **Last Updated**: 2025-05-21

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Vue3 Electron 网易云音乐

这是一个基于 Vue3 + Electron + TypeScript 开发的网易云音乐桌面客户端。项目采用前后端分离架构，前端使用 Vue3 构建用户界面，后端使用 NeteaseCloudMusicApi 提供数据服务。本项目只是用于学习实践，请勿用于商业用途。


## 主要功能

- ✨ 首页推荐
- 📊 排行榜页面
- 👨‍🎤 歌手页面
- 🎵 歌单页面
- 🔍 搜索功能
- ▶️ 播放工具条
- 📃 播放歌单
- 🔐 扫码登录
- ❤️ 我的歌单
- 🎨 皮肤切换

## 项目预览

![首页推荐](./img/微信截图_20250113184825.png)
![播放页面](./img/微信截图_20250113185409.png)
![排行榜](./img/微信截图_20250113185426.png)
![搜索页面](./img/微信截图_20250113185457.png)
![搜索页面](./img/微信截图_20250113185618.png)
![搜索页面](./img/微信截图_20250113185704.png)
![搜索页面](./img/微信截图_20250113185733.png)
![搜索页面](./img/微信截图_20250113185811.png)
![搜索页面](./img/微信截图_20250113185819.png)
![搜索页面](./img/微信截图_20250113185843.png)

## 技术栈

### 前端
- Vue 3
- TypeScript
- Electron
- Element Plus
- Pinia
- Vue Router

### 后端
- NeteaseCloudMusicApi
- Node.js
- Express

## 项目结构

```├── electron-vue3-music/     # 前端项目
│   ├── src/                 # 源代码
│   ├── public/              # 静态资源
│   ├── dist/                # 打包后的文件
│       ├──electron-vue3-music-1.0.0-setup.exe            #安装程序
│       ├──win-unpacked                                   #免安装目录
│   └── ...
│
└── NeteaseCloudMusicApi/   # 后端项目
    ├── module/            # API模块
    ├── util/             # 工具函数
    └── ...
```

## 本地开发

1. 克隆项目
```bash
git clone <repository-url>
```

2. 安装依赖

前端:
```bash
cd electron-vue3-music
yarn install
```

后端:
```bash
cd NeteaseCloudMusicApi
yarn install
```

3. 启动服务

后端:
```bash
cd NeteaseCloudMusicApi
npm start
```

前端:
```bash
cd electron-vue3-music
yarn dev
```

## 打包构建

```bash
cd electron-vue3-music
yarn run build:win
```

## 致谢

- [NeteaseCloudMusicApi](https://github.com/Binaryify/NeteaseCloudMusicApi) - 网易云音乐 Node.js API service
- [Vue](https://vuejs.org/)
- [Electron](https://www.electronjs.org/)

## License

[MIT](LICENSE)