百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

做了N+1个企业项目之后,我总结了这些React必备插件

ccwgpt 2025-06-12 11:18 19 浏览 0 评论

为了提高大家开发 React 项目的效率, 笔者结合自己的实际工作经验, 汇总如下React项目常用插件.

1. 状态管理



  • ReduxJavaScript 状态容器,提供可预测化的状态管理
  • MobX 通过函数响应式编程使得状态管理变得简单和可扩展
  • Redux ThunkRedux的异步处理中间件
  • Redux SagaRedux中间件,用于管理应用程序 Side Effect(副作用,例如异步获取数据,访问浏览器缓存等)
  • Dva 一个基于 reduxredux-saga 的数据流方案

2. UI组件库



  • Ant design 基于 Ant Design 设计体系的 React UI 组件库,主要用于研发企业级中后台产品
  • Ant design mobile 基于 Ant Design 设计体系的 React UI 移动端组件库
  • MaterialUI 世界最受欢迎的基于质感设计的React UI
  • React toolbox 一套使用CSS模块功能实现GoogleMaterial Design规范的React组件
  • React Virtualized 一个能渲染大型列表和表格的React解决方案
  • Fabric UI 微软开源的UX框架的集合,用于创建共享代码,设计和交互行为的精美的跨平台应用程序
  • React desktop 基于ReactJavaScript库,旨在将本机桌面体验带入网络,其中包含许多macOS SierraWindows 10组件。react-desktopNW.jsElectron.js完美结合,但是可以在任何JavaScript驱动的项目中使用
  • Zent 有赞 PC 端 WebUI 规范的 React 实现,提供了一整套基础的 UI 组件以及一些常用的业务组件
  • react-icons 基于React封装的丰富的图标库

3. 工具类



  • react-copy-to-clipboard 基于React的复制到剪切板组件
  • qrcode.react 基于React的生成二维码的组件
  • nprogress 适用于YouTubeMedium等的顶部进度条组件
  • react-syntax-highlighter 基于React的代码高亮组件
  • react-contextmenu 右键菜单组件
  • emoji-mart 基于React的表情库
  • react-highlight-words 基于React的关键字高亮

4. 数据可视化



  • AntV 包含 G2G6F2L7 以及一套完整的图表使用和设计规范, 提供强大的数据可视化需求
  • G2Plot 基于G2封装的开箱即用的可视化组件库
  • recharts 使用ReactD3构建的自定义的图表库
  • Viser 支持多种主流框架的可视化库

5. 动画/动效果



  • Halogen 使用React的加载动画集合
  • react-move 漂亮的,数据驱动的React动画,只需3.5kb(gzip)
  • react-spring 一个基于弹簧物理学的动画库
  • Ant Motion 提供了单项,组合动画,以及整套动画解决方案
  • scenejs 基于JavaScriptCSS时间轴的动画库
  • react-text-loop 文字轮播动画

6. 拖拽/排序



  • react-beautiful-dnd 漂亮,可移植性 列表拖拽库
  • react-dnd 可帮助我们构建复杂的拖放界面,同时保持组件的分离
  • react-moveable 支持自由拖拽, 缩放, 参考线的灵活强大的拖拽库
  • react-grid-layout 强大的网格拖拽排序缩放库
  • mixitup 强大的列表卡片排序动画库

7. 图像处理



  • react-image-crop 强大的图片裁切库
  • react-sparklines 基于数据自动生成趋势线
  • dom-to-image 基于dom生成图片的canvas
  • react-img-editor 图片编辑器

8. 编辑器相关



  • braft-editor 富文本编辑器
  • powerNice markdown/富文本编辑器
  • GGEditor 可视化图编辑器
  • react-codemirror2 代码编辑器
  • jsoneditor json编辑器
  • h5-dooring H5页面编辑器

9. 地图相关



  • google-map-react 谷歌地图插件
  • react-amap 高德地图插件
  • @uiw/react-baidu-map 百度地图

10. 脚手架



  • Create React App 初学者必备React傻瓜式脚手架
  • Next.js 构建服务端渲染的React脚手架
  • umi 企业级前端应用框架
  • webpack3_react 兼容IE9+且提供完整的React全家桶解决方案

最后

觉得有用 ?喜欢就收藏,顺便点个赞吧,你的支持是我最大的鼓励!搜索 “趣谈前端”,发现更多有趣的H5游戏, webpack,node,gulp,css3,javascript,nodeJS,canvas数据可视化等前端知识和实战.

相关推荐

自己动手写Android数据库框架_android开发数据库搭建

http://blog.csdn.net/feiduclear_up/article/details/50557590推荐理由关于Android数据库操作,由于每次都要自己写数据库操作,每次还得去...

谷歌开源大模型评测工具LMEval,打通谷歌、OpenAI、Anthropic

智东西编译|金碧辉编辑|程茜智东西5月28日消息,据科技媒体TheDecoder5月26日报道,当天,谷歌正式发布开源大模型评测框架LMEval,支持对GPT-4o、Claude3.7...

工信部:着力推动大模型算法、框架等基础性原创性的技术突破

工信部新闻发言人今日在发布会上表示,下一步,我们将坚持突出重点领域,大力推动制造业数字化转型,推动人工智能创新应用。主要从以下四个方面着力。一是夯实人工智能技术底座。通过科技创新重大项目,着力推动大模...

乒乓反复纠结“框架不稳定”的三个小误区

很多球友由于对框架的认知不清晰,往往会把“框架不稳定”当成一种心理负担,从而影响学球进度,其典型状态就是训练中有模有样,一旦进入实战,就像被捆住了手脚。通过训练和学习,结合“基本功打卡群”球友们交流发...

前AMD、英特尔显卡架构师Raja再战GPU,号称要全面重构堆栈

IT之家8月5日消息,知名GPU架构师拉贾科杜里(RajaKoduri)此前曾先后在AMD和英特尔的显卡部门担任要职。而在今日,由Raja创立的GPU软件与IP初创企...

三种必须掌握的嵌入式开发程序架构

前言在嵌入式软件开发,包括单片机开发中,软件架构对于开发人员是一个必须认真考虑的问题。软件架构对于系统整体的稳定性和可靠性是非常重要的,一个合适的软件架构不仅结构清晰,并且便于开发。我相...

怪不得别人3秒就知道软考案例怎么做能50+

软考高级统一合格标准必须三科都达到45分,案例分析也一直是考生头疼的一门,但是掌握到得分点,案例能不能50+还不是你们说了算吗?今天就结合架构案例考点,分享实用的备考攻略~一、吃透考点,搭建知识框架从...

UML统一建模常用图有哪些,各自的作用是什么?一篇文章彻底讲透

10万+爆款解析:9大UML图实战案例,小白也能秒懂!为什么需要UML?UML(统一建模语言)是软件开发的“蓝图”,用图形化语言描述系统结构、行为和交互,让复杂需求一目了然。它能:降低沟通成本避...

勒索软件转向云原生架构,直指备份基础设施

勒索软件组织和其他网络犯罪分子正越来越多地将目标对准基于云的备份系统,对久已确立的灾难恢复方法构成了挑战。谷歌安全研究人员在一份关于云安全威胁演变的报告中警告称,随着攻击者不断改进数据窃取、身份泄露和...

ConceptDraw DIAGRAM:释放创意,绘就高效办公新未来

在当今数字化时代,可视化工具已成为提升工作效率和激发创意的关键。ConceptDrawDIAGRAM,作为一款世界顶级的商业绘图软件,凭借其强大的功能和用户友好的界面,正逐渐成为众多专业人士的首选绘...

APP 制作界面设计教程:一步到位_app界面设计模板一套

想让APP界面设计高效落地,无需繁琐流程,掌握“框架搭建—细节填充—体验优化”三步法,即可一步到位完成专业级设计。黄金框架搭建是基础。采用“三三制布局”:将屏幕横向三等分,纵向保留三...

MCP 的工作原理:关键组件_mcp部件

以下是MCP架构的关键组件:MCP主机:像ClaudeDesktop、GitHubCopilot或旅行助手这样的AI智能体,它们希望通过MCP协议访问工具、资源等。MCP主机会...

软件架构_软件架构师工资一般多少

软件架构师自身需要是程序员,并且必须一直坚持做一线程序员。软件架构应该是能力最强的一群程序员,他们通常会在自身承接编程任务的同时,逐渐引导整个团队向一个能够最大化生产力的系统设计方向前进。软件系统的架...

不知不觉将手机字体调大!老花眼是因为“老了吗”?

现在不管是联系、交友,还是购物,都离不开手机。中老年人使用手机的时间也在逐渐加长,刷抖音、看短视频、发朋友圈……看手机的同时,人们也不得不面对“视力危机”——老花眼,习惯眯眼看、凑近看、瞪眼看,不少人...

8000通用汉字学习系列讲座(第046讲)

[表声母字]加(续)[从声汉字]伽茄泇迦枷痂袈笳嘉驾架咖贺瘸(计14字)嘉[正音]标准音读jiā。[辨形]上下结构,十四画。会意形声字,从壴从加,加也表声。注:从壴,字义与鼓乐有关;从加,字义与...

取消回复欢迎 发表评论: