Fumadocs

用户指南

自动化设置和安装组件的 CLI 工具。

安装

为 CLI 初始化配置：

npx @fumadocs/cli

您可以在配置中更改组件的输出路径。

组件

选择并安装组件。

npx @fumadocs/cli add

您可以直接传递组件名称。

npx @fumadocs/cli add banner files

魔法是如何实现的？

CLI 从 Fumadocs 的 GitHub 仓库获取组件的最新版本。 当您安装组件时，它保证是最新的。

此外，它还会转换导入路径。 请确保使用最新版本的 CLI

这深受 Shadcn UI 的启发。

自定义

自定义 Fumadocs 布局的简单方法。

npx @fumadocs/cli customise

Tree

使用终端中的 tree 命令为 Fumadocs UI 的 Files 组件生成文件树。

npx @fumadocs/cli tree ./my-dir ./output.tsx

您也可以输出 MDX 文件：

npx @fumadocs/cli tree ./my-dir ./output.mdx

查看帮助以获取更多详细信息：

npx @fumadocs/cli tree -h

示例输出

output.tsx
import { File, Folder, Files } from 'fumadocs-ui/components/files';

export default (
  <Files>
    <Folder name="app">
      <File name="layout.tsx" />
      <File name="page.tsx" />
      <File name="global.css" />
    </Folder>
    <Folder name="components">
      <File name="button.tsx" />
      <File name="tabs.tsx" />
      <File name="dialog.tsx" />
    </Folder>
    <File name="package.json" />
  </Files>
);

How is this guide?

Last updated on

On this page

安装
组件
魔法是如何实现的？
自定义
Tree
示例输出