html仿网易云网站,GitHub - Hdoove/music-webapp: 仿网易云webapp
仿网易云webApp(持续更新中)
配置安装
开发环境
Node Latest
Npm Latest
Installing
使用npm安装依赖
��
npm install
npm start 或 npm run start
打包生产环境
npm run build
Deployment
线上服务可为静态资源服务器，将root设为 /dist 路径， 并将子路由$uri重定向至root。
Built With
生产环境依赖
开发环境依赖
less - css预处理
babel - 语法编译
Eslint - 代码检查
prettier - vscode比编辑器自动格式化工具
文件结构
+-- configs /全局配置
+-- public /静态资源
+-- src
| +-- actions /全局action
| +-- apis /�axios请求文件
| +-- components /公用组件
| | +-- Header 公共头部
| | +-- RunIcon 动态图标
| | +-- SearchShow 搜索组件
| | +-- SongList 歌曲列表组件
| | +-- SongSheet 歌单列表
| +-- reducers /全局reducer
| | +-- index.js /根reducer
| +-- routes /路径文件入口
| | +-- Album 专辑
| | +-- Home 首页
| | +-- MusicList 歌单详情
| | +-- MusicPlay 播放页
| | +-- RankingList 榜单页
| | +-- Search 搜索页
| | +-- SongerDetail 歌手详情页
| | +-- Songers 歌手页
| | +-- SongSheetList 歌单广场
| +-- sagas /全局saga
| +-- utilities 工具
| | +-- index.js /根saga
| +-- App.js /项目入口文件
| +-- index.js /注册根saga, 根reducer等app启动配置
+-- templates /webpack �ejs模版
+-- .babelrc.js /babel配置文件
+-- webpack.config.js /webpack配置文件
代码规范
代码风格及规范请参考， 具体�见 .eslintrc.js
设置eslint + prettier自动格式化参考链接
https://blog.echobind.com/integrating-prettier-eslint-airbnb-style-guide-in-vscode-47f07b5d7d6a
Webpack配置
babel-loader (所有babel js语法编译 & ie适配的配置 统一通过babel-loader 载入.babelrc.js
2.style-loader/css-loader/less-loader
url-loader/svg-url-loader (inline 20kb以下图片)
image-webpack-loader (无损压缩图片)
html-loader/ejs-loader (html/ejs模版)
file-loader(字体及其他文件类型)