用户指南

CLI 工具用于自动化设置和在 Fumadocs 应用中安装组件。

安装

运行以下命令初始化 CLI 配置：

npx @fumadocs/cli

组件的输出路径可以在生成的配置中调整。

组件

使用 add 子命令选择并安装组件：

npx @fumadocs/cli add

也可以直接传入组件名作为参数。例如，添加 banner 和 files 组件：

npx @fumadocs/cli add banner files

工作原理

CLI 直接从 Fumadocs GitHub 仓库拉取每个组件的最新版本，确保安装的组件始终是最新的。它还会自动执行导入路径转换。建议始终使用最新版本的 CLI。

这种方式的灵感来源于 Shadcn UI。

自定义

customise 子命令提供了修改 Fumadocs 布局的便捷方式：

npx @fumadocs/cli customise

Tree

tree 命令生成适用于 Fumadocs UI Files 组件的文件树结构。它接受一个输入目录和一个输出文件路径。

生成 `.tsx` 输出

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

生成 `.mdx` 输出

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

示例输出

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>
);

用户指南

On this page