Skip to content

konglingwen94/vue-music

Repository files navigation

vue-music

A vue mobile music project

线上预览

http://123.57.204.48:4000

previewQrcode

安装依赖

npm install

启动后台 API 服务

npm run server

启动一个具有热重载功能的开发环境

npm start

项目构建

npm run build

项目部署

npm run deploy

修改 deploy.sh 文件 中的部署命令
scp -r server/* 你的服务器用户名@你的服务器公网 IP:服务器项目存放目录

实现功能

  • 歌手

    • 歌曲
    • 专辑
    • MV
  • 歌单
    • 全部分类
    • 歌单列表
    • 歌单详情
  • 视频
    • 视频播放
    • 分类选择
  • 搜索
    • 热门搜索
    • 搜索历史
    • 分页加载
  • 播放器
    • 吸底播放
    • 全屏播放
    • 进度条
    • 上一首
    • 下一首
    • 播放/暂停
    • 播放模式
    • 收藏
    • 音质选择
    • 音量控制
    • 歌词展示

使用技术栈

vue + vuex + vue-router

express 搭建服务端 API

mint-ui + cube-ui + vux

lyric-parser把给定的歌词字符串解析成有格式文本的一个插件

good-storage 快速操作 localStorage 的第三方插件

vue-lazyload 一个基于Vue的图片懒加载插件

lib-flexible 由淘宝开发的移动端适配方案库

页面截图

videoRadio-picker songlist songSheet songPlayer(2) songPlayer(1) singerDetail(3) singerDetail(2) singerDetail(1) singer searchResult search playlist mv mv-picker miniPlayer categoryGroup categoryDetail