README.md

音你所需，专为开发者而生​ 😍

支持多平台定制开发 😋

逻辑清晰，不懂提issue

功能

• 登录
• 搜索
• 歌词
• 歌单
• 个性推荐
• 排行榜
• 歌手

成果

技术栈

• react hook
• redux
• react-router
• antd

下面链接的文章，记录我写这个项目使用的 hook 的业务场景

https://bearcub.club/2020/07/24/react-hook-在项目中的应用

⚠️ 声明

✋ 本项目仅作为技术研究和项目开发练习，非商业用途

🈲 不允许引用本项目进行商业用途，否则自行承担法律责任

本地玩转

🔌 下载依赖

本项目依赖
npm install / yarn install

NeteaseCloudMusicApi
支持 npx 方式运行,会自动安装依赖和运行

npx NeteaseCloudMusicApi

🏃 运行

🐢 快速 (开发)

注：以下的backend start build http-server 皆为 npm scripts

backend 
start 

🚀 高速 (生产)

1. 需要安装 http-server -> npm install --global http-server
2. 需要打包 build (只需一次)

3. backend
4. http-server 

核心技术

更新歌曲

1. updateSong(data) // 更新歌曲信息 -> 获取 id、api
2. updateIdIndex(idIndexData) // 更新当前歌曲索引 (有歌单)

如下，控件播放下一首歌

    function nextSong() {
        const nextIndex = autoIndex + 1
        if (nextIndex !== songList.length) {
            const data = songList[nextIndex]
            const idIndexData = {
                idIndex: nextIndex
            }
            dispatch(updateSong(data))
            dispatch(updateIdIndex(idIndexData))
        }
    }

这两个 action 会触发 audio 的effect（副作用) -> 更新 audio