对不起，咱们来晚了 —— 基于 React 的组件库 Zarm 2.0 发布

（图片来自众安科技）

是的，你们可能很疑惑：“都2020年了，怎么如今还发布组件库呢？”...

确实，对于前端组件库的你们庭来讲，咱们迟到了，但也请各位能够抽出几分钟看看一位初来乍到的新人的自我介绍：

Zarm是什么

​ Zarm 是众安科技基于 React、React-Native 研发的一款适用于企业级的移动端UI组件库。(官网|github|演示地址 推荐在手机上浏览)

​ Zarm 的取名，灵感来源于众安保险秉承的理念：作有温度的保险。Zarm = za + warm，za表明众安，warm有“温暖的”意思，以重合的a字母为中心，各取左右两部分。追求极致的用户体验，致力于作有温度的组件库也是zarm项目发起的初衷。

​ Zarm的发展历程：起初，zarm的前身还只是一个我的项目，2018年后慢慢在众安健康险事业部推广使用。2019年初，众安宣布直营产品品牌化的战略方向 ，这意味着各大BU的产出页面都有可能投放到直营渠道；为了规范了众安系产品基础组件的视觉及交互，总体提高众安系产品的用户体验，保障产品体验的一致性，所以，在众安技术委员会的发起下，Zarm项目诞生了；通过各个BU团队优秀设计师们的努力下，数月后终于敲定了视觉和交互规范，Zarm的前端代码的实现采起自由认领的方式，全公司活跃的前端er们迅速推动，最终趋于稳定，用于生产环境；为了让业务同窗和设计、前端的认知造成统一，Zarm造成Axure元件库、项目模板规范等 帮助业务同窗快速完成高质量的产品原型；三者相辅相成，最终实现了下降整条工做链路上人力成本和沟通成本的目标。

​ Zarm经历了两年多的业务沉淀，服务过十个事业部中近百项目，这使得咱们相信除了在众安内部，zarm必定也有它的用武之地。

Zarm的优点

多

• 组件多。Zarm目前开源了50个组件，基本覆盖常见的通用组件，并仍在持续更新迭代中。

（图片来自众安科技）

• 规范多：

  拥有完整统一的设计规范。

  样式命名采用了BEM的规范，内部实现使用了Css Variables + SCSS Mixins，这使得样式维护的工做变得优雅简洁。

  遵循严格的代码规范，基于airbnb的lint封装的eslint规则以及基于stylelint实现的样式规范。

快

• 依赖少体积小，极少的依赖三方库，Gzip压缩后，全量组件只有60kb左右的大小。
• 支持按需加载，zarm 默认支持基于 ES module 的 tree shaking。

好

• 扩展性好，咱们提供了内置的基础组件，能够方便地基于现有组件实现二次开发。

  好比咱们的Popup组件就是全部弹层类组件的基础，Modal、Toast、Loading、ActionSheet、Picker、Select等都是基于 Popup 组件实现。再好比PickerView组件就是滑动选择类组件的基础，而Picker组件就是简单的将Popup和PickerView结合而成。相信你也能够基于这些基础组件开发出更丰富的业务组件~

• Zarm也会密切关注官方的更新，在发布的正式版中，咱们已去除在React17中再也不常规使用的生命周期，更新为最新的生命周期。
• 响应及时，目前在内部开源的状况下，已有接近3000次的commit，在及时响应issue的同时，咱们也保持着快速的迭代。后续也会有官方讨论群，只要有问题，咱们必定及时跟进，不会让问题石沉大海。
• 稳定性好，Zarm使用Jest + Enzyme作单元测试。单元测试覆盖率超过80%，而且在持续攀升中。

爽

• 友好的typescript支持，都2020年了，再不用ts的话世界末日真的就要来了。
• 样式使用css变量，支持一键换肤，自定义皮肤。

  

Zarm的将来

在不久的将来，咱们会推出：

• 桌面端组件库 Zarm-Web。
• hpaPaaS 无代码建站平台（名字暂时保密）。

  ......

对不起，咱们来晚了

​ 在各个前端团队或本身研发、或使用第三方组件库的时代，咱们推出Zarm组件库的时机可能有些晚。可是咱们也是抱着后来者居上的决心，但愿能在组件库领域开辟一块属于Zarm的疆土。

​ 在现在这个前端变化无穷的时代，你们也不妨在开发新项目时尝试下新的组件库，说不定比目前使用的好呢~

最后，很是感谢你的阅读，也很是欢迎有兴趣的同窗加入咱们共建更好的Zarm！

​

Github开源地址
https://github.com/ZhongAnTech/zarm

请给Zarm一个star！
​
欢迎提出你的issue和PR！

扫描二维码加入官方讨论群

​