Convert Figma logo to code with AI

SmallRuralDog logoelectron-vue-music

基于 electron-vue 开发的音乐播放器,界面模仿QQ音乐,技术栈electron-vue+vue+vuex+vue-router+element- UI。欢迎star

2,129
524
2,129
11

Top Related Projects

高颜值的第三方网易云播放器,支持 Windows / macOS / Linux :electron:

网易云音乐 Node.js API service

一个基于 electron 的音乐软件

2,077

音乐搜索器 - 多站合一音乐搜索解决方案

🌈谷粒-Chrome插件英雄榜, 为优秀的Chrome插件写一本中文说明书, 让Chrome插件英雄们造福人类~ ChromePluginHeroes, Write a Chinese manual for the excellent Chrome plugin, let the Chrome plugin heroes benefit the human~ 公众号「0加1」同步更新

25,440

Wiki.js | A modern and powerful wiki app built on Node.js

Quick Overview

Electron-vue-music is a desktop music player application built using Electron and Vue.js. It aims to provide a cross-platform, modern music listening experience with a sleek user interface and integration with popular music streaming services.

Pros

  • Cross-platform compatibility (Windows, macOS, Linux)
  • Modern and responsive user interface built with Vue.js
  • Integration with multiple music streaming services
  • Customizable themes and layouts

Cons

  • Limited documentation and community support
  • Potential performance issues on lower-end hardware
  • Dependency on third-party APIs for music streaming services
  • May lack some advanced features found in more established music players

Getting Started

To get started with electron-vue-music, follow these steps:

  1. Clone the repository:

    git clone https://github.com/SmallRuralDog/electron-vue-music.git
    
  2. Install dependencies:

    cd electron-vue-music
    npm install
    
  3. Run the development server:

    npm run dev
    
  4. Build the application for your platform:

    npm run build
    

The built application will be available in the dist folder.

Competitor Comparisons

高颜值的第三方网易云播放器,支持 Windows / macOS / Linux :electron:

Pros of YesPlayMusic

  • More active development with frequent updates and bug fixes
  • Cleaner and more modern user interface design
  • Better cross-platform support, including web and mobile versions

Cons of YesPlayMusic

  • Larger codebase, potentially more complex to maintain
  • Heavier resource usage due to additional features and animations
  • Steeper learning curve for contributors due to more advanced technologies used

Code Comparison

YesPlayMusic uses Vue 3 with Composition API:

import { ref, computed } from 'vue';

export default {
  setup() {
    const count = ref(0);
    const doubleCount = computed(() => count.value * 2);
    return { count, doubleCount };
  }
};

electron-vue-music uses Vue 2 with Options API:

export default {
  data() {
    return {
      count: 0
    };
  },
  computed: {
    doubleCount() {
      return this.count * 2;
    }
  }
};

YesPlayMusic leverages more modern Vue features, while electron-vue-music uses a more traditional approach. This difference in Vue versions and API styles can impact development experience and performance.

网易云音乐 Node.js API service

Pros of NeteaseCloudMusicApi

  • More comprehensive API coverage for NetEase Cloud Music
  • Higher star count and more active community support
  • Regularly updated with new features and bug fixes

Cons of NeteaseCloudMusicApi

  • Lacks a user interface, requiring additional frontend development
  • Focused solely on API functionality, not providing a complete music player solution
  • May require more setup and integration work for a full application

Code Comparison

electron-vue-music:

import { app, BrowserWindow } from 'electron'
import '../renderer/store'

let mainWindow
function createWindow() {
  mainWindow = new BrowserWindow({
    height: 563,
    useContentSize: true,
    width: 1000
  })
  // ... more code
}

NeteaseCloudMusicApi:

const express = require('express')
const apicache = require('apicache')
const path = require('path')
const fs = require('fs')
const app = express()

// ... more code

The electron-vue-music project focuses on creating an Electron-based desktop application with Vue.js, while NeteaseCloudMusicApi is a server-side Express.js application providing API endpoints. The code snippets highlight these fundamental differences in their architecture and purpose.

一个基于 electron 的音乐软件

Pros of lx-music-desktop

  • More active development with frequent updates and bug fixes
  • Larger community and user base, resulting in more feedback and contributions
  • Supports multiple music sources and platforms

Cons of lx-music-desktop

  • More complex codebase due to additional features
  • Potentially higher resource usage due to broader functionality
  • Steeper learning curve for new contributors

Code Comparison

electron-vue-music:

import { app, BrowserWindow } from 'electron'
import '../renderer/store'

let mainWindow

lx-music-desktop:

const { app, BrowserWindow, shell } = require('electron')
const { join } = require('path')
const { initSetting, getSetting } = require('./utils/setting')

The code comparison shows that lx-music-desktop uses CommonJS modules, while electron-vue-music uses ES6 imports. lx-music-desktop also includes additional imports for file system operations and custom utility functions, indicating a more complex structure.

Both projects utilize Electron for creating desktop applications, but lx-music-desktop appears to have a more comprehensive setup with additional utilities and configurations. This aligns with its broader feature set and more active development.

2,077

音乐搜索器 - 多站合一音乐搜索解决方案

Pros of music

  • Lightweight and simple web-based implementation
  • Supports multiple music sources (QQ, Netease, Xiami, etc.)
  • Easy to deploy and use without installation

Cons of music

  • Limited features compared to a full desktop application
  • May have potential issues with API stability due to reliance on third-party sources
  • Less polished user interface

Code comparison

music:

$music_api = [
    'qq'       => 'https://c.y.qq.com',
    'kugou'    => 'http://m.kugou.com',
    'kuwo'     => 'http://kuwo.cn',
    'xiami'    => 'http://www.xiami.com',
    'baidu'    => 'http://music.baidu.com',
    'netease'  => 'http://music.163.com'
];

electron-vue-music:

const apiConfig = {
  baseURL: 'https://netease-cloud-music-api-rust-delta.vercel.app',
  timeout: 5000
}

export const request = axios.create(apiConfig)

Summary

music is a web-based solution that offers multi-source support and easy deployment, while electron-vue-music is a more feature-rich desktop application built with Electron and Vue.js. The code comparison shows that music uses a PHP array to define multiple API endpoints, whereas electron-vue-music uses a single API endpoint with Axios for requests. Choose music for simplicity and web accessibility, or electron-vue-music for a more robust desktop experience.

🌈谷粒-Chrome插件英雄榜, 为优秀的Chrome插件写一本中文说明书, 让Chrome插件英雄们造福人类~ ChromePluginHeroes, Write a Chinese manual for the excellent Chrome plugin, let the Chrome plugin heroes benefit the human~ 公众号「0加1」同步更新

Pros of ChromeAppHeroes

  • Extensive collection of Chrome extension recommendations and guides
  • Regular updates with new content and extensions
  • Multilingual support (Chinese and English)

Cons of ChromeAppHeroes

  • Not a functional application, primarily a documentation repository
  • Limited code examples or implementation details
  • Focused solely on Chrome extensions, lacking cross-platform support

Code Comparison

ChromeAppHeroes is primarily a documentation repository, so there isn't much code to compare. However, here's a small example of how the content is structured in ChromeAppHeroes:

# 062《彩云小译》一键实现网页中英文对照的翻译工具
...

In contrast, electron-vue-music is a functional application with Vue.js and Electron code:

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

Summary

ChromeAppHeroes is a comprehensive guide for Chrome extensions, offering valuable insights and recommendations. It's regularly updated and supports multiple languages. However, it lacks the functionality of a standalone application like electron-vue-music, which is a full-fledged Electron-based music player. ChromeAppHeroes is more suitable for users looking to enhance their Chrome browsing experience, while electron-vue-music caters to those seeking a desktop music application.

25,440

Wiki.js | A modern and powerful wiki app built on Node.js

Pros of Wiki

  • More comprehensive and feature-rich, designed for collaborative knowledge management
  • Active development with frequent updates and a larger community
  • Supports multiple authentication methods and has extensive documentation

Cons of Wiki

  • More complex setup and configuration compared to the simpler music player
  • Requires a server to run, unlike the desktop-based Electron app
  • May have a steeper learning curve for users and administrators

Code Comparison

Wiki (Node.js):

const Wiki = require('wiki.js')
const wiki = new Wiki({
  port: 3000,
  dataPath: './data'
})
wiki.start()

electron-vue-music (Vue.js):

<template>
  <div id="app">
    <audio-player :src="currentTrack" />
    <playlist :tracks="playlist" />
  </div>
</template>

Summary

Wiki is a robust knowledge management system with extensive features, while electron-vue-music is a simpler, desktop-based music player. Wiki offers more collaboration tools and scalability but requires more setup and resources. electron-vue-music provides a straightforward music playback experience with a potentially easier setup for individual users. The choice between them depends on the specific needs of the project: knowledge management vs. music playback.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

当前项目已停止更新,基于VUE3+TS的版本已开源,项目地址

>>>VUE3-MUSIC<<<

音乐播放器

一个基于 electron-vue 开发的音乐播放器

运行
git clone https://github.com/SmallRuralDog/electron-vue-music.git

cd electron-vue-music

yarn

yarn dev

注意 正式打包需要把图标样式下载到本地,否则正式版图标不显示

网易云音乐 API

已经集成到 electron

使用文档

文档地址

UI

支持

如果你觉得 electron-vue-music 节省了你的开发时间,让你少加班,让你能更早的回家陪女友或者打游戏,能让你更快速的挣到钱,那么请支持我,让我能继续的将 electron-vue-music 做好,做下去!