Element Plus X 重磅推出 XMarkdown 组件
🙊大家好，我是嘉悦，好久没见。这次组件库迎来了一个🌹非常炸裂的组件，XMarkdown 组件。我们对比了多个组件库的 markdown 渲染的原理，发现之前的 markdown-it 虽然有强大的插件系统，但是解析出来的 token 会有点问题。这点对自定义渲染，可能不是很友好。
另外，之前的打字器组件，使用的是 markdown-it 做的支持，并且使用的是 v-html 进行的渲染，这导致我们的 markdown 的渲染，做不到增量渲染。导致如果流式输出的接口很快的情况下，可能会有一些渲染的瓶颈。
💩考虑到，用户对产品的体验，和 Vue开发者 的开发负担。我们推出了 XMarkdown 组件
🎀功能预览，上限拉满 😍
| 功能 | 描述 | 是否支持 |
|---|---|---|
| 增量渲染 | 极致的性能 | ✅ |
| 自定义插槽 | 可以是 h 函数的组件，也可以是 template 模版组件，上手更简单 | ✅ |
| 行级代码块高亮 | 内置样式，可自定义 | ✅ |
| 代码块高亮 | 内置折叠、切换主题色、复制代码块、滚动吸顶功能 | ✅ |
| 数学公式 | 支持行级公式和块级公式 | ✅ |
| mermaid 图表 | 内置切换查看代码、缩放、归位、下载、复制代码块功能 | ✅ |
| 自定义 echarts | 自定义渲染 | ✅ |
| 拦截 ``` 后面的标识符 | 拦截后可获取内容进行自定义渲染 | ✅ |
| 拦截标签 | 拦截后可进行自定义渲染 | ✅ |
在项目中使用后，大概是这个样子
💖 代码块
💖 自定义代码块
💖 数学公式
💖 mermaid 图表
💖 自定义 mermaid 图表
💖 自定义属性
💖 自定义标签
目前，我们已经将组件上新到组件库 storybook 分支开源，并且已经发布最新beta版本。💐欢迎大家升级体验
pnpm add vue-element-plus-x@1.2.26-betabeta版本更新内容:
最新的在线预览，我们已经换成 storybook 的形式，后续会继续完善。
🎀 未来展望 😍
- 😁等 XMarkdown组件 稳定后，我们将会把这个版本，推送到主版本中。
- 🥰预计下周，我们将会推出一个对 vue2 的支持的一个独立库，并负责维护下去
- 💩对这个项目感兴趣的朋友，可以加交流群或者作者微信，我们后续将开发 pr 贡献者群，处理日常的维护和issue。👉交流邀请
🎀 模版项目进度 😍
后续我们会将稳定的，新的组件，陆续集成到我们的模版项目中，敬请期待🍉🍉🍉
💝 项目地址，快速链接体验
还是老样子，附上相关文档链接，方便跳转
| 名称 | 链接 |
|---|---|
| 👀 模版项目 预览 | 👉 在线预览 |
| 🍉 模版项目 源码 | 👉 github 👉 gitee |
| 🎀 模版项目 开发文档 | 👉 模版项目 开发文档 |
| 💟 Element-Plus-X 组件库 | 👉 Element-Plus-X 组件库 开发文档 |
| 🎃 Element-Plus-X 组件库交流群 | 👉 交流3群二维码地址 github 👉 交流3群二维码地址 gitee 💖加入交流群，获取最新的技术支持💖 |
| 🚀 若依AI项目 源码 | 👉 github 👉 gitee |
| 🔥 Hook-fetch 超优雅请求库 | 👉 源码学习 |
