加载器插件

概览

🌐 Overview

加载器插件可以扩展 loader() 以自定义其输出。

🌐 Loader plugins can extend loader() to customise its output.

内置插件列表：

🌐 A list of built-in plugins:

• Lucide 图标：使用来自 Lucide React 的图标（需要安装 lucide-react）。

  import { loader } from 'fumadocs-core/source';
  import { lucideIconsPlugin } from 'fumadocs-core/source/lucide-icons';
  
  export const source = loader({
    // ...
    plugins: [lucideIconsPlugin()],
  });

创建插件

🌐 Creating Plugins

每个插件都是一个对象：

🌐 Each plugin is an object:

import { loader } from 'fumadocs-core/source';

export const source = loader({
  plugins: ({ typedPlugin }) => [
    typedPlugin({
      // plugin config
    }),
  ],
});

存储

🌐 Storage

在此过程中，你的输入源文件将被解析并在内存中形成一个虚拟存储。

🌐 During the process, your input source files will be parsed and form a virtual storage in memory.

在处理之前执行虚拟文件系统操作，你可以钩子 transformStorage。

🌐 To perform virtual file-system operations before processing, you can hook transformStorage.

import { loader } from 'fumadocs-core/source';

export const source = loader({
  plugins: ({ typedPlugin }) => [
    typedPlugin({
      transformStorage({ storage }) {
        storage.read('my/path');
      },
    }),
  ],
});

页面树

🌐 Page Tree

页面树是根据你的文件系统生成的，一些不必要的信息（例如未使用的前置属性）将会被过滤。

🌐 The page tree is generated from your file system, some unnecessary information (e.g. unused frontmatter properties) will be filtered.

你可以使用 transformPageTree 对其进行自定义，例如向节点附加自定义属性，或自定义页面的显示名称。

🌐 You can customise it using the transformPageTree, such as attaching custom properties to nodes, or customising the display name of pages.

import { loader } from 'fumadocs-core/source';

export const source = loader({
  plugins: ({ typedPlugin }) => [
    typedPlugin({
      transformPageTree: {
        file(node, file) {
          // access the original (unfiltered) file data
          if (file) console.log(this.storage.read(file));

          // modify nodes
          node.name = <>Some JSX Nodes here</>;
          return node;
        },
      },
    }),
  ],
});