Vue 全家桶高仿网易云音乐 mac 客户端版（不像赔十个！）

[sl1673495]

音乐播放器虽然烂大街了，但是作为前端没自己撸一个一直是个遗憾，而且偶然间发现 pc 端 web 版的网易云音乐做的实在是太简陋了，社区仿 pc 客户端的网易云也不多见，为了弥补这个遗憾，就用 vue 全家桶模仿 mac 客户端的 ui 实现了一个，欢迎提出意见和 star~

预览地址

源码地址

进度

• 搜索歌曲+播放（版权歌曲无法播放)
• 发现页
• 播放列表
• 全部歌单
• 最新音乐
• cd 页（评论区才是灵魂）
• 主题换肤功能

后端接口

https://binaryify.github.io/NeteaseCloudMusicApi

技术栈

• Vue 全家桶 vue-cli3 create 出来的。
• ui 库用了魔改样式的 element-ui
• 歌词滚动部分用了黄轶老大的 better-scrool （贼爽）
• 主题换肤用的 css 变量替换。
• ES 6 / 7 （ JavaScript 语言的下一代标准）
• Sass （ CSS 预处理器）

Screenshots

安装与使用

前端项目

npm i
npm run serve

后端项目

node app.js

更新版本，加入了 mv 播放功能。
http://shanshihao.cn/mv/10883392

[moneyduo]

不错啊 打破零回复 狗头

[anky]

很漂亮！不错

[gaigechunfeng]

打破零回复。这么掉的项目已经 1000 多星，其实也不用来 V2EX 宣传了。
总之厉害，我是 mark 了。

[Corbusier]

先码上一个看看

[caijunyi]

牛逼，先送星！

[ranwu]

图片挂了，老铁。

[shanlan]

我就问一句，你们 CSS 到底怎么学的？为什么我的 CSS 写不出我想要的结果？

[wu67]

@shanlan css 需要脑洞和时间积累, 不像 js 可以靠其他语言基础硬啃

[mamahaha]

你这标题我看成了 Vue 全家桶模仿网易云音乐，然后网易云音乐的人不高兴了，派你来发牢骚。

[MMMMMMMMMMMMMMMM]

感觉云音乐这种直接用 canvas webgl 整个一起画更省事点

[yaoliyc]

先收藏了

[cm15006]

已 star
有电台的话就更棒了

[1239305697]

厉害了。已 star

[MinQ]

@mamahaha 笑出声

[xiangyi007]

已 Star,看起来很好！

[yaoliyc]

包装成客户端？

[sl1673495]

@yaoliyc electron 吗

[sl1673495]

@mamahaha 哈哈哈

[yaoliyc]

@sl1673495 比较流行的是这个吧。

[sl1673495]

@shanlan 直接 flex 一把梭

[xiaotuzi]

想问下撸了多久做出来的？

[sl1673495]

@xiaotuzi 上周五启动的项目

[15651980765]

给大佬递茶

[lenling]

克拉斯

[likaka]

不像呀

[nicoljiang]

非常喜欢。

[xiaotuzi]

@sl1673495 速度很快啊！是不是有什么插件

[sl1673495]

@xiaotuzi 木有啊 就是比较专心写。多封装些通用的。
Ui 库是用 eelemen 也省了不少事

[sl1673495]

@xiaotuzi element

[sl1673495]

cd 页优化了一下 加了推荐歌单和相似歌曲

[sl1673495]

添加了 rem 支持，对大屏幕更友好

[sl1673495]

附言更新了预览图片

[yukiloh]

雾草 13k 的项目…