vue2 怎么用vite_利用 vite 快速搭建 vue3 组件库

利用 vite 快速搭建 vue3 组件库

背景

vue3 出来已经有一段时间了，刚好前端时间做了 vue-general-components，在想着要不也把 vue3 的做一下；

社区上有很多相关的框架 ant-design-vue 、element-plus、elenext 等，而我对里面的技术以及先有 vue3 社区中一些框架进行了一些分析选择，并最终运用到新的项目 vite-components-playground 中。

虽然看上去没什么内容已经包含了一个组件库应有的所有内容了，接下去逐个解析一下。

文档系统

文档是一个组件库的灵魂，文档系统为什么不借鉴主流组件库的？其实之前用 elementui 包括 ant-design-vue，都是自己内部实现的文档系统，整个文档也是用 webpack-dev-server 构建一下，或者自己封装一些工具库，比如 antd-tool，cooking 等，但其实很难有可提取复用的点，部分已经没落了；还有一点就是设计，大厂的设计都有点产品特色，就有点大厂的格局在那。不像 vuepress 这种能够一通百通的产品出现，所以并没有可借鉴的地方；简单来说，太重。

不过可惜我比较中意的 vuepress 只支持 vue2。

vitepress

其实喜欢用 md 写文档的同学来说，感觉 vitepress 应该是最好的，因为之前的 vue-general-components 我就是用的 vuepress，使用起来特别顺手，但实际上社区现在对 vitepress 暂时没有做更多的深入，而且项目一直处于 WIP。

vitepress 的设计理念其实和 vuepress 完全不同，现在官方 issues 模版直接带上 VitePress is still WIP, and it is not compatible with VuePress.，还有 readme 里面的一句话。But the overall idea is that VitePress will have a drastically more minimal theming API (preferring JavaScript APIs instead of file layout conventions) and likely no plugins (all custo