Next.js документация на Fumadocs
Оформления, начална страница и помощни функции SEO за сайтове за документация, създадени с Next.js и Fumadocs.
npm install onedocs fumadocs-core fumadocs-mdx fumadocs-ui lucide-react@0.562Последна версия 0.1.27 MIT Next.js 16, Node 20.9+
import { HomePage, CTASection } from "onedocs";
export default function Home() {
return (
<HomePage config={config} packageName="my-package">
<CTASection
title="Ready to get started?"
cta={{ label: "Read the Docs", href: "/docs" }}
/>
</HomePage>
);
}На практика
Onedocs подава един конфигурационен обект към оформленията Fumadocs UI.
Една конфигурация, едно оформление
onedocs.config.ts съдържа заглавието и описанието на сайта и хранилището GitHub, а DocsLayout го чете заедно с дървото на страниците от източника ви Fumadocs.
Оформлението визуализира страничната лента, превключвателя на темата, връзка GitHub, създадена от nav.github, и диалоговия прозорец за търсене, който изпраща заявки към маршрут /api/search, добавен от вас.
Ръководството „Първи стъпки“ показва останалите файлове: източника на съдържание, конфигурацията Next.js, кореновото оформление и маршрута на страницата.
import { defineConfig } from "onedocs/config";
export default defineConfig({
title: "My Docs",
description: "Documentation for my project",
nav: {
github: "username/repo",
},
});import { DocsLayout } from "onedocs";
import type { ReactNode } from "react";
import { source } from "@/lib/source";
import config from "../../../onedocs.config";
export default function Layout({ children }: { children: ReactNode }) {
return (
<DocsLayout config={config} pageTree={source.pageTree}>
{children}
</DocsLayout>
);
}Готови оформления
DocsLayout, DocsPage и HomePage ви предоставят основа за документация със странична лента, търсене и съдържание, както и начална страница.
Един конфигурационен файл
defineConfig() в onedocs.config.ts задава заглавието, описанието, логото, навигационните връзки, футъра, както и основната секция и функциите на началната страница.
Първо Markdown
Пишете файлове .md или .mdx в папката си със съдържание, с оцветяване на синтаксиса и съдържание на всяка страница.
Търсене
Вграденото търсене Orama на Fumadocs. Добавете един маршрут API с createFromSource и диалоговият прозорец за търсене ще го използва.
Тъмен режим
Светлата и тъмната тема идват от Fumadocs UI, а оформлението на документацията включва превключвател на темата. Логата и иконите на сайта поддържат варианти за светъл и тъмен режим.
Готово за TypeScript
Поддръжка на TypeScript с типобезопасна конфигурация и автоматично довършване в редактора ви.
SEO и llms.txt
Помощни функции за sitemap.xml, robots.txt, llms.txt, llms-full.txt, метаданни на страници и изображения Open Graph.
Персонализируемо
Възможности за директно използване на компонентите Fumadocs, когато ви е нужен по-голям контрол над документацията.
Разгледайте пълното ръководство за Onedocs — от инсталирането и първата употреба до разширените работни процеси и подробностите за API.