Skip to content

基于 Vue2、Vue-cli、Element-UI 的仿网易云音乐 | Cloud Music based on Vue 2 + Vue-cli + Element-UI

License

Notifications You must be signed in to change notification settings

Mkild/cloudmusic

Repository files navigation

Cloud Music

cloudmusic

vue vue-cli vue-router vuex element-ui sass version license

Cloud Music 🎵 网易云音乐

基于 Vue2、Vue-cli、Element-UI 的仿网易云音乐 | Cloud Music based on Vue 2 + Vue-cli + Element-UI

同时使用了:Vue Router, Vuex, Sass...

简介

一个平平无奇的低仿网易云,有待补完。

所用 CDN: 75CDN

项目预览 部署在 Vercel 上,速度较慢: cloudmusic
仅国内可访问:cloudmusic

接口指路: NeteaseCloudMusicApi

快速启动

# 克隆项目
# cnpmjs
git clone https://github.com.cnpmjs.org/Mkild/cloudmusic.git
# or
git clone https://github.com/Mkild/cloudmusic.git
# 进入项目目录
cd cloudmusic
# 安装依赖 (推荐yarn)
npm install  / yarn
# 启动服务
npm run serve  / yarn serve
# 打包
npm run build  / yarn build

使用到的插件/工具库

  • npm npm Node.js 自带的依赖管理工具
  • eslint-plugin-vue eslint-plugin-vue 为在.vue 文件和包含 vue 代码的 js 文件中使用 ESlint 提供支持
  • axios axios 基于 Promise 的 HTTP 请求库
  • qs qs 查询参数序列化和解析库
  • babel-plugin-component babel-plugin-component element-ui 按需引入需要的插件
  • @babel/preset-env @babel/preset-env babel 的预设插件,处理 js 浏览器兼容
  • postcss-preset-env 处理 css 浏览器兼容
  • postcss-pxtorem 将 px 换算成 rem,实现自适应
  • vue-meta vue-meta 用于 Vue 的 metadata 管理器
  • vue-lazyload vue-lazyload 用于 Vue 的图片懒加载
  • good-storage good-storage 对原生 web storage 的封装,简单好用
  • lodash-es lodash-es js 模块化工具库 lodash 的 es modules 版本,体积更小
  • better-scroll better-scroll 用于歌词滚动,这部分代码用的别人的
  • xgplayer xgplayer 西瓜视频播放器,支持按需引入
  • workbox-webpack-plugin workbox-webpack-plugin 谷歌的利用 Service Worker 实现页面预缓存的插件

工程化

浏览器支持

IE  EdgeEdge FirefoxFirefox ChromeChrome SafariSafari
last 2 versions last 2 versions last 2 versions last 2 versions last 2 versions

快照

image.png

image.png

image.png

image.png

image.png

image.png

About

基于 Vue2、Vue-cli、Element-UI 的仿网易云音乐 | Cloud Music based on Vue 2 + Vue-cli + Element-UI

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published