41 - 《如何实现文档站点》
发布于 2022年1月18日
最近在做 umi@4 的收尾,而 dumi 暂不支持 umi@4,如果用 umi@3 做 umi@4 的文档感觉比较怪,所以今天整理完 umi@4 的文档结构之后,转头写了个基于 umi 4 的文档站点 rfc,也可以理解为 lite dumi。只包含文档功能,不支持组件。
之前 dumi 由 Peach 老师操刀,我还没看过实现。今天简单过了一遍社区的竞品,包括 vitepress、vuepress、docusaurus 和 nextra,觉得整体实现步骤包括:
1、文件路由。docs 目录下的 md 或 mdx 文件即路由。
2、解析器。能解析 md 和 mdx 文件,通常转化为 react 组件。解析工具两大派,remark 和 markdown-it,前者基于 unifiedjs 扩展性更好一些,再加上 @mdx-js/mdx 做 mdx 的解析,gray-matter 做头部信息的解析,prism 和 prism-react-renderer 做语法高亮,等等。
3、主题式设计。通过 theme 的设计,不仅支持文档站,还可以支持 blog、landing page、resume 等。时间原因,第一步先做 doc 主题,