为了提高React项目的开发效率,笔者结合自己的实际工作经验,将React项目的常用插件总结如下。1.状态管理ReduxJavaScript状态容器,提供可预测的状态管理MobX通过函数式反应式编程使状态管理简单且可扩展,浏览器缓存访问等)Dva基于redux和redux-saga的数据流解决方案2.UI组件库AntdesignReactUI组件库基于AntDesign设计体系,主要用于开发企业级中后台产品AntdesignmobileReactUI移动端组件库基于AntDesign设计系统的MaterialUI全球最流行的基于纹理设计的ReactUI库React工具箱一套使用CSS模块功能实现GoogleMaterialDesign规范的React组件ReactVirtualized渲染器React解决方案用于大型列表和表格的FabricUI微软的o集合pensourceUXframeworksforcreatingbeautifulcross-platformapplicationsthatsharecode,design,andinteractionReactdesktopReact-basedJavaScriptlibrarydesignedtobringthenativedesktopexperiencetolife通过许多macOSSierra和Windows10组件带到网络上。react-desktop与NW.js和Electron.js完美结合,但它可以用于任何JavaScript驱动的项目。Zent对PC端WebUI规范的React实现赞不绝口,提供了一套完整的基础UI组件和一些常用的业务组件react-icons基于React封装的丰富图标库3.工具类react-copy-to-clipboardReact基于复制到剪贴板组件qrcode.react基于React的二维码生成组件nprogress适用于YouTube、Medium等顶部进度条组件react-syntax-highlighter基于React的代码高亮组件react-contextmenu右键菜单组件emoji-martReact-based表情库react-highlight-wordsReact-basedkeywordhighlighting4.数据可视化AntV包含G2、G6、F2、L7和一套完整的图表使用和设计规范,提供强大的数据可视化需求。G2Plot是基于G2封装的开箱即用的可视化组件库recharts。Viser,一个用React和D3构建的自定义图表库,支持多种5.动画/动效Halogen使用React的加载动画合集react-move漂亮,数据驱动的React动画,只有3.5kb(gzip)react-spring一个基于react-spring的动画库onspringphysicsAntMotion提供单项、组合动画、一整套动画解决方案scenejs基于JavaScript和CSS时间轴的动画库react-text-loop文本轮播动画6.拖拽/排序react-beautiful-dnd美观、便携listdrag拖拽库react-dnd可以帮助我们构建复杂的拖拽界面,同时保持组件分离。react-moveable支持自由拖拽、缩放,灵活强大的拖拽库react-grid-layout。强大的网格拖动排序缩放库mixitup强大的列表卡片排序动画库7.图像处理react-image-crop一个强大的图片裁剪库react-sparklines根据数据自动生成趋势线dom-to-image一个基于dom生成图片的canvas库react-img-editorImageeditor8.编辑器相关braft-editor丰富文本编辑器powerNicemarkdown/富文本编辑器GGEditor可视化图表编辑器react-codemirror2代码编辑器jsoneditorjson编辑器h5-dooringH5页面编辑器9.地图相关google-map-react谷歌地图插件react-amap高德地图插件@uiw/react-baidu-map百度地图10.脚手架创建ReactApp初学者必备React傻瓜式脚手架Next.jsReact脚手架搭建服务端渲染umi企业级前端应用框架webpack3_react兼容IE9+并提供一个完整的React全家桶解决方案本文转载自微信公众号“趣谈前端”,转载文章可通过以下二维码关注,转载请联系趣谈前端公众号。
