AntdSite - 一个基于 Ant Design 和 GatsbyJs 的文档生成器

[wangyi7099]

前言

简介

AntdSite(Ant Design Of Site) 是一个基于[Ant Design](The world's second most popular React UI framework)，由GatsbyJs驱动的一个网站生成器 (你可以完全不会这两项技术，只需要会 markdown 的基础知识，然后简单配置，就能搭建一个网站。当然，如果你会这两项技术那更好)。文档的配置参考了基于 vue 的文档生成器 - [vuepress](Config Reference | VuePress)。

由来

以前我是vuepress的用户，在开发 vue 组件中使用它来写文档感觉非常顺手。 后来我开始研究上了 react，开发 react 组件就得有文档呀，我在这期间陆续试了几个基于 react 的文档生成器，像docz, docusaurus . 但是试用了下，感觉都不如 vuepree 顺手。后来，我访问[Ant Design](Ant Design - 一个 UI 设计语言)官网的时候突然冒出来一个想法： 把Ant Design官网做成可配置可以吗？ 答案是可以的。于是，antdsite就诞生了。

总的来说就是把 antd 官网改成可配置的了。

特点

• 跟 vuepress 相仿的配置。上手简单。只需要掌握 markdown 基础知识和一点 js 只是就能上手。
• 可以在 markdown 里写jsx, 还能在里面直接使用 全部 ant design 组件。 参考文档：[使用 jsx](在 Markdown 中使用 JSX | AntdSite)
• 支持自定义部分布局，例如头部，尾部，首页等。支持自定义全部布局。参考文档：[自定义主题](自定义主题 | AntdSite)

快速开始

使用 cli 快速初始化一个项目

yarn global add antdsite-cli

# 或者如果你使用 npm

npm i antdsite-cli -g


antdsite my-docs

然后访问本地8000端口就可以啦。

运行截图

常见问题

这个和 vuepress 配置完全一样的吗？

大部分是模仿的 vuepress 的配置的，但也有一些不同。比如配置中没有自定义端口，地址,PWA 等。 那些需要配置Gatsby的，交给 AntdSite 反而更加繁琐。

我不会 react 可以使用吗？

完全可以。上手的要是是仅仅是 markdown 基础知识和一点 js 知识。

可以将自定义主题做成插件形式发布到 npm 上吗？

这个暂时不可以，不过未来可以考虑加入这个功能。

如果还有问题可以留言一起讨论～

写在最后

• github 地址
• 官网

[eluotao]

支持 我最近也在找文档. 也很喜欢 vuepress 但也在学习 recat