Vuevue前端开发那些事儿

基于 Vue3 + Typescript + Vite2 打造一

2021-08-29  本文已影响0人  YongHengFu

基于 Vue3 + Typescript + Vite2 打造网易云音乐播放器

Vue3 全家桶,Composition API

Vite2 问就是闪电⚡

第三方网易云音乐播放器 📻

💻 在线体验 PingMusic 登录体验更多精彩

Github传送门 各位大佬点个star星星✨

🎧 UI灵感来源QQ音乐、Apple Music


⚙️ 项目技术栈

📯 Vue v3.x

🎺 Vite v2.x

🎸 Vue Router v4.x

🥁 Vuex v4.x

🎹 Typescript

🎨 功能

🎆 支持登录网易云账号,收听私人歌单,收藏喜欢音乐

🎇 精选推荐

✨ 独家放送

🎉 分类歌单

🎊 排行榜单

🎄 歌手浏览

🎋 新歌速递

🎍 视频MV播放

🎏 歌单详情

🎐 歌手详情

🎑 播放界面

🔧 部分功能有待完善

🔨 更多功能正在开发中

源码在这

(https://github.com/YongHengFu/ping-music-next) 各位大佬点个star星星✨

🌈 界面截图

image image image image image image image image image image image image image

最后

虽然目前完成度还行,但是还有许多功能需要完善,不过学习Vue3和Vite的目标已经达成了,Vite用起来是真的爽,Vue3 的 Composition API刚开始写的时候很不习惯,后来...真香!!!

一开始搭建框架的时候是采用了Ant Design,但是后来写着发现用了Ant Design还是大部分都是自定义样式,所以就完全手写样式了(Layout目前还用的是Ant Design,有空把它也去掉)

整个项目花时间最多的应该是歌词滚动那一块,现在回过头,发现还是有挺大的优化空间的,后续再把这块给重构一下。

源码在这:

(https://github.com/YongHengFu/ping-music-next) 各位大佬点个star星星✨

上一篇下一篇

猜你喜欢

热点阅读