react仿网易云音乐项目实践(一)

前言

react +webpack5 + ts 框架搭建专栏学习后,很长时间没有来掘金更新了,今天起正式开始进行项目实践开发!!!

产品:仿网易云音乐demo

前置项

react:react18

打包工具:webpack5

路由:react-router-dom@6.x

UI:antd4.21.7

语言:typescript

node: node14
axioseslintprettier代码规范配置


基础配置

1. Header头部导航

header引入logo图片时,报以上问题: 解决方法:global.d.ts中进行声明

头部导航效果如下: 引入antd-icon图标时一直报:缺少rev属性 解决:antd官网上也有好多人反馈该问题

官网大牛建议:升级@type/react @type/react-dom至最新版本 以上升级之后,又报错: 原因查找:说是由于TS版本与@types/react版本不匹配导致 但是版本一致后仍存在该问题

最终解决: tsconfig.json中添加改配置 最终header效果:

2.待续...

相关链接:github代码地址

相关推荐
To_OC7 小时前
别再瞎写 React Router!7 个高频踩坑点一次性讲透
前端·javascript·react.js
岭南灯火8 小时前
前端通用交互式几何编辑器的开发经验
前端·设计模式·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 7 - 设计模式与原则
前端·设计模式·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 4 - 绘制、悬停与编辑
前端·设计模式·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 3 - 数据对象的设计
前端·javascript·架构
Jackson__9 小时前
从 LLM 到 Agent:一篇文章搞懂 AI 圈热词!
前端·agent·ai编程
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 2 - 交互事件流
前端·javascript·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 6 - 配套设施与工程化
前端·设计模式·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 5 - 辅助元素的设计
前端·设计模式·架构
岭南灯火9 小时前
前端通用交互式几何编辑器的设计法则 1 - 入口的对象及其成员
前端·javascript·架构