/cool-music

:musical_note:A music app based on Vue

Primary LanguageVue

Cool Music

 Build Status node npm Webpack Vue Vuex axios better-srcoll

facebesidewyj's github stats

项目简介

入坑 Vue 以来，一直苦没有真正的实战项目来提升自己，所以在工作之余开发了一个基于 Vue2.0+版本的音乐 WebAPP。项目构建初期也在 github 上参考了众多案例，通过学习并阅读他人的成熟代码进而提升自己，历时一个半月完成了 Cool Music 这个项目。我希望把这个项目的源代码开放出来，来帮助更多的前端爱好者们，大家共同进步，共同提升。

技术栈

  1. Vue 相关：Vue、Vue-router、Vue-lazyload。
  2. 脚手架：Vue-cli。
  3. 状态管理：Vuex。
  4. 构建工具：Webpack。
  5. CSS 预处理：Less。
  6. 移动端插件：better-scroll、fastclick。
  7. 数据获取：axios。
  8. 代码风格规范工具：ESLint。
  9. JavaScript 语法标准：ECMAScript 2015。
  10. 动画相关：create-keyframe-animation。
  11. 本地存储：Store.js

实现的功能

  1. 轮播图功能的实现。
  2. 歌单、歌曲列表的展现。
  3. 音乐的播放、暂停、快进、快退和同步歌词的实现。
  4. 歌手列表通讯录的实现。
  5. 搜索功能、热门搜索和保存历史记录功能的实现。
  6. 收藏歌曲，个人相关功能的实现。
  7. 上拉加载，页面侧滑。播放器收起和弹出等动画的实现。

构建步骤

# 安装依赖库
npm install

# 启动webpack内置服务
npm run dev

# 项目构建
npm run build

# 生产打包并查看报告
npm run build --report

项目预览

写在最后

如果大家觉得还行，能否帮忙 Star 下？

😘😘😘