谈一谈前端私有组件库的必要性（组件库系列一）

前言

工作多年遇到各种各样的项目，往往在固定的岗位或者说固定的业务部门，同类型的项目出现的频率极高。很多同学对于组件库这个概念更多的使用场景，可能是拿到开源的一些组件库开箱即用。如PC端的ElementUI、Ant-design、移动端的vant之类的。这些开源的组件库能够很大程度的满足页面开发的需求，组件库没有兼顾的到的组件可能通过搜索引擎查一下对应的插件，引入进来使用即可。今天我是想和大家聊一聊建立自己私有组件库的一个必要性。

说明

很多人听到“私有组件库“，脑海里首先浮现出重复造轮子 、时间成本大、开发完后问题多、流程复杂等系列问题。我完全认同这种说法，重复造轮子价值十分有限。但是我认为私有组件库并不是非得从0开始的。我们可以基于一个组件去进行对应的二次开发，保持原组件库内容不变的前提下，进行组件库的二次封装，并且添入一些组件库未包含的内容。如：

• 公共基础样式（space、border、position、flex布局等）
• 公共通用函数（Array处理类、Object处理类、时间处理类等）
• 公共指令（防抖、错误图片、复制、水印等指令）
• 可以对原组件库进行二次封装，去除内容一些重复性操作，扩展原组件库内容
• 项目中封装的一些不含业务性的组件也可以抽离到组件库

私有组件库的好处

对组件的原理有更深的理解

写组件库和业务中写组件有着极大的不同。
业务中组件的开发：规范性弱、适应性低、与业务强耦合、不同的项目可复用性差。且相对来说技术含量较低，

举例：面试一些同学的时候，我会问vue开发的时候有写过组件吗？大部分人都会回答有的。但是呢同样有着很大一部分的同学，对于$$attrs和$listeners这些东西没有用过，甚至没有听说过。这些点在写基础组件或者业务组件的时候是避不过去的点。

组件库开发能够遇到项目中遇不到的技术难点。独立完成一个组件库后对项目代码的编写会更加的驾轻就熟。

提升开发效率

组件库的开发，核心的点是用来提升工作效率。跟设计部门将设计规范融入到前端样式规范和组件中。将常用的组件库、公共内容等通过一起打包。将原有需要东拼西凑的零散点集结一起。能够减少工作的重复代码率。自己写的组件库通过文档的支撑，可以辐射到整个前端团队。加快团体的工作效率以及代码风格的一致性。并且通过不同的项目洗礼，让私有组件库更佳完善。

更好的找工作

虽然有没有私有组件库并不能成为这个前端技术能力的的评判标准，但是面试的时候不管是对HR还是面试官，能够介绍自己所做的组件库。这在面试中是能够有着极大的加分项的。

PS: 后续更新我会从0开始讲一下我搭建一个私有组件库、封装各个组件以及公共内容的全部过程。欢迎大家指点、互相探讨

hc-basic已开源
组件库代码地址：
https://gitee.com/yangxiongasin/hc-basic
组件库文档代码地址：
https://gitee.com/yangxiongasin/hc-docs

对组件库开发有兴趣的可以进QQ群： 617330944大家一起讨论交流