markdown生成组件库文档方案

创建时间3 年前
更新时间3 年前
浏览量0

AI 智能摘要

本文介绍了开发组件库时如何通过本地npm link调试，并借鉴arco组件库的文档生成方式，实现集中预览和查询使用文档的功能。文章详细描述了从markdown到最终展示的流程，包括markdown->html->JSX->AST->转化->生成CODE的步骤，并提供了相关技术参考链接。（预计阅读时间：1分钟）

成品

https://design.zzfzzf.com/

背景

开发一个组件库，我们往往本地npm link来调试，但是我们没有一个集中预览和查询使用文档的地方。在参考流行UI组件库后，最终借鉴arco的组件库文档生成方式。

所需要的知识基础

markdown
webpack-loader
babel
AST

以button按钮为列,文档分为描述、demo展示、demo源码

大致流程为markdown->html->JSX->AST->转化->生成最近展示的CODE

#讨论区

00条评论

实时对话

loading...

成品

https://design.zzfzzf.com/

背景

开发一个组件库，我们往往本地npm link来调试，但是我们没有一个集中预览和查询使用文档的地方。在参考流行UI组件库后，最终借鉴arco的组件库文档生成方式。

所需要的知识基础

markdown
webpack-loader
babel
AST

以button按钮为列,文档分为描述、demo展示、demo源码

大致流程为markdown->html->JSX->AST->转化->生成最近展示的CODE