我在维护一个组件库，一个vue组件库，还没有支持vue2.0
他的名字叫N3, github链接在此 N3 , 还有这是 文档
这个项目的初衷是用在管理系统能统一ui，快速开发，由于当时比较喜欢vue，所以选择其作为组件方案，当时并没有高可用的组件库，于是就自己撸起袖子写一套，毕竟等着别人填坑还不如填自己的坑
以前没独立写过完整的组件库，写一个组件和一个组件库不是一种类别的工程
写一个拥有10个组件的组件库的工作量远大于写10个独立组件
首先，你需要建立一个
项目结构
- 由于要发布到npm，所以要遵循npm包的结构
- 构建方式，使用webpack，vue的单文件形式很适合开发组件
- 你需要一个文档目录来存放组件说明，以及平时的开发调试
- 还有最后的dist目录供开发者使用
也许有人说，我开发一个单组件也需要这样的结构啊，想想也没错，那么下面这个可能就比较特殊
组件复用
我的组件库也很多组件，vue文件就有60+，其中有很多组件是被大量复用的，比如button组件比如input组件，提高组件的复用性能使你的项目看起来比较优雅，这种理由不要也罢，最主要的还是减少了我的工作量。当我能通过尽可能少的逻辑将几个组件组装成一个新组件的时候，才明白了，封装细粒度组件的重要性。（尽管vue已经做的很好，但是无法能用到类似react的render以及高阶组件还是比较遗憾）
接下来聊聊
样式
- 一个组件库需要有统一的视觉风格，非设计师的本人理解以及最简洁实践就是统一那些重要的基本样式属性，如主题色，字体大小颜色，色系，浮框类组件的阴影效果以及表单元素的高度等。我将这些全部都定义成less变量来统一管理，也方便为后面的主题实现提供可能
- 命名空间。我给所有组件的class都加上了前缀，进行组件的样式隔离，这个很重要
- 主题。前面说我把基本属性都定义成less变量，事实上还不止如此，我把尽可能多的可变的（非组件核心骨架样式）的属性都分离出来（这个过程还是有点复杂，很多需要经过计算才能保证变量的不当定义不引发组件的基本展示错乱）这样，只要我改变这些值就能打造自己的主题。于是，我参考ant的风格做了一个类似的，当然无法完全相同: ant风格的N3
API设计
组件的API设计是一个非常让人头疼的事。大家都希望有一个使用简单，但又功能强大，能覆盖尽可能多场景的组件。这其中有一连串的问题，我必须开放哪些参数，哪些参数看似必要，但是使用场景却很少，应该砍掉，通过现有参数的配合是否能cover大多场景，如果没有，是否有替代方案。这些你必须自己使用，然后参考成熟的设计，通过用户反馈来完善，最后找到尽量好的方案
日常
维护一个开源项目，要有
- 严谨的提交规范
- 清晰的版本日志
- 用户反馈渠道，可以通过issue管理bug和建议，也可以通过qq群来和用户交流
以上，我还会继续维护这个组件库，接下来会有更多组件，更少bug，更好的是设计，更多好看的主题 : )
期待你的关注，使用和加入
GitHub - N3-components/N3-components: N3-components = vue.js + n3 ui (Interface drived by data).
