# 我不是网抑云 **Repository Path**: space-earth/musicapp ## Basic Information - **Project Name**: 我不是网抑云 - **Description**: 仿网易云音乐app - **Primary Language**: JavaScript - **License**: Not specified - **Default Branch**: master - **Homepage**: http://m.starrysky.world/ - **GVP Project**: No ## Statistics - **Stars**: 1 - **Forks**: 0 - **Created**: 2020-11-12 - **Last Updated**: 2021-03-14 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README 预览地址：[我不是网抑云](http://m.starrysky.world/)请使用手机端访问或使用PC端打开开发者工具选择手机模式调试查看 ## 我不是网抑云 ``` 1.克隆项目到本地后在项目目录下打开命令窗口，执行以下命令安装依赖 npm install 2.数据请求接口由网易云音乐api提供，需要克隆到本地，可复制下面的链接跳转克隆 https://github.com/Binaryify/NeteaseCloudMusicApi 3.克隆完成后在网易云音乐api项目目录下打开命令窗口，启动服务 node app.js 4.网易云音乐api启动后再回到本项目目录下执行命令启动musicapp项目，在musicapp目录下打开命令窗口执行 npm run serve 注：在执行以上步骤之前需要安装node.js/可在vue.config.js文件中更改相关配置 ``` ## 主要运用技术 ``` - Vue2 #Vuex，Vue Router，Vue CLI，钩子函数 - 组件&插件 #vant，swiper，js-md5 - 其他 #less预编译语言，es6，axios，vue3 setup，localstorage，iconfont，rem布局 ``` ## 功能一览（按页面划分） ### 1.Home页（根目录页） ``` - banner轮播图 #自动切换，支持跳转类型包含单曲、专辑、歌单、Mv、外部活动页 - 菜单按钮 #每日推荐（需登录使用）、私人FM、歌单、排行榜 - 发现好歌单 #默认推荐6个歌单，可通过查看更多或菜单中的歌单跳转歌单广场 - 左侧边栏 #未登录时显示默认头像及登录按钮，登录后展示用户头像、昵称及等级和退出登录 ``` ### 2.歌单详情页（左上角回退） ``` - 歌单基本信息（cover、标题、创建者、简介、评论数、分享数） - 播放全部 #使用播放全部功能会将歌单全部加入播放列表并从歌单第一首开始播放 - 收藏 #收藏歌单功能需要登录，若未登录会自动跳转登录页 - 歌曲标题 #点击跳转播放页 - 右侧播放按钮 #如果存在，可以跳转到歌曲Mv播放页 ``` ### 3.搜索页（Home页右上角进入） ``` - 搜索 #支持搜索单曲、专辑和歌单，支持搜索建议 - 热搜榜 #点击热搜具体排名支持跳转该词搜素结果 - 历史记录 #默认收录最多13个，可清空 ``` ### 4.登录页（未登录时可见） ``` - 登录 #只支持网易云账号登录，密码采用md5加密接口验证 #登录背景随机切换 #若当前正在播放歌曲，登录过程不会中断歌曲播放 ``` ### 5.歌单广场页 ``` - 分类 #支持推荐、华语、流行、摇滚、民谣、电子、另类/独立、轻音乐、综艺、影视原声、ACG等分类 #分类支持无限滚动 #暂未设置自定义添加标签分类 ``` ### 6.排行页 ``` - 榜单 #支持官方榜单（飙升榜、新歌榜、原创榜、热歌榜）和其他所有榜单 ``` ### 7.MV播放页 ``` - Mv播放 #默认原生控件控制播放 #若当前正在播放歌曲，跳转MV播放页时会将该歌曲暂停播放 ``` ### 8.个人信息页（登录后可见） ``` - 基本信息 #用户名，关注数量，粉丝数，等级，头像，简介，cover - 歌单 #用户创建歌单、用户喜欢的音乐单、收藏歌单 ``` ### 全局功能 ``` - 底部播放按钮 #（在登录页以及MV播放页会隐藏），支持跳转到播放页，暂停/播放歌曲 - 播放页 #基本信息（歌曲名&演唱者，歌名或演唱者名无法显示完全时会自动定时滚动） #点击播放页中间区域可以选择展示CD还是歌词，歌词支持自动滚动，无法通过歌词调节歌曲进度 #进度条可控制歌曲播放进度，歌词会跟随进度跳转 #底部按钮 上一曲&播放/暂停&下一曲 - 更新提示 #用户首次进入会提示APP更新信息，可在APP.vue中配置更新说明 ```