周末两天玩了下号称西湖区东半球最牛逼的react文档站点生成工具dumi，顺带结合github pages生成了react-uni-comps文档站， 一套弄下来，感觉真香，现在还只是浅尝，高级的特性还没玩完，文档还需继续打磨完整，不知道是不是东半球最牛逼，西湖全区应该无与伦比了 :)，下面是当前文档站移动端和pc端预览截图（整套弄下来花了半天时间!）
桌面端效果(手机界面模拟/桌面端效果/自动根据ts生成的API表格文档)
手机效果(支持light/dark主题)
文档站点制作步骤如下：
- 安装 dumi 和移动端主题 dumi-theme-mobile
- 添加配置文件.umirc.ts,下面是我的配置
- 编写组件文档，以/mdx/Button.md举例子, 我把文档放在了mdx目录,因为github pages需要使用docs目录
- 因为组件比较多，我这里markdown文档通过ejs动态生成，当组件api/demo更新时，可以自动更新文档,无需手工维护
<API src="https://juejin.cn/src/<%= name %>.tsx"></API>
`;
data.( {
group..( {
item. = subIdx;
item. = idx;
item. = group.;
item. = group.;
item. = item. === ? item. : ;
fileName = path.(__dirname, );
(fs.(fileName)) {
fs.(fileName);
}
fs.(path.(__dirname, ), ejs.(tpl, item));
});
});
- 开发构建
- 配置github pages
点击项目settings->左边的Pages一栏， 设置Source， 我这里选择master分支, /docs目录托管构建的文档站，点击save保存， 然后打开上面他告之的github pages链接即可预览
以上就是本篇文章【使用dumi生成react组件库文档并发布到github pages】的全部内容了，欢迎阅览 ！ 文章地址：http://w.yusign.com/quote/2699.html 行业 资讯 企业新闻 行情 企业黄页 同类资讯 网站地图 返回首页 述古往 http://w.yusign.com/mobile/ , 查看更多