在提笔写下这篇文章之前,我查阅了很多的平台的文章,看下大家都怎样把一个话题写好,也学习到不少东西,非常感谢有这样一个平台可以和大家互相交流。话说回来,我看过很多书(文章),不少是写一堆的理论,凑字数就完事了,这不是我想的,我尽可能写得简单清晰,让大家看完可以马上从零开始(记得要自己动手丰衣足食)。 写这篇文章原因是因为刚好年底做项目总结,把公司产品做了规划,把组件做了整合整理(我们用 Vue2+),于是造了轮子,也借此机会给感兴趣的朋友分享下经验。 前端组件化是当今热议的话题之一,也是我们在项目开发中经常会碰到的问题,目前各个大厂开源了自己的 UI 库,有入 iView、Element 等,但是现实中存在一些问题,比如每个公司业务组件不尽相同,没有办法完全满足需求,又或者各位 Geek 想通过学习框架,来打造属于自己的一套组件库,那么该如何去做呢? 本话题分为以下6部分内容: 1. 环境配置 2. 代码组织结构 3. 开始第一个组件 4. 思考全局组件 5. 编写 API 文档 6. 打包发布 > 可能需要你会一点 webpack、ES6 和 Vue 的知识,以下代码为了直观,大部分会以截图方式展示,只有特殊地方会以 code 方式出现。具体代码可以查看线上版本 [XMUI](https://github.com/monw3c/xmui)。 ----------